<template>
  <div id="regulation" ref="second" class="regulation">
    <timePicker @timeChange="timeChangeFn" />
    <!-- 左侧边栏 -->
    <div class="left-module">
      <!-- 零售业态 -->
      <!-- <div class="retail-format">
        <div
          class="lm-top"
          :style="`background:url(${bgImg[0]});background-size: 100% 100%;`"
        ></div>
        <div class="lm-center">
          <retail-format
            ref="retailFormat"
            :retailFormatData="retailFormatData"
            :retailFormatEachrt="retailFormatEachrt"
          ></retail-format>
        </div>
      </div> -->

      <!-- 重点监管 -->
      <div class="ks-module">
        <div
          class="lm-top"
          :style="`background:url(${bgImg[1]});background-size: 100% 100%;`"
        ></div>
        <div class="lm-center zdjg-box">
          <div class="km-center">
            <key-supervision
              ref="keySupervision2"
              :pieProcess="ksModuleData.hitEchart"
            ></key-supervision>
            <key-supervision
              ref="keySupervision1"
              :pieProcess="ksModuleData.superviseEchart"
            ></key-supervision>
            <div class="ks-list">
              <div
                class="ks-list-item"
                v-for="item in ksModuleData.totalList"
                :key="item.name"
              >
                <span class="fs-14 fw-600">{{ item.name }}</span>
                <div>
                  <span class="fs-20 fw-600 main-color">
                    <CountTo
                      :startVal="startVal"
                      :endVal="Number(item.num)"
                      :duration="duration" /></span
                  >&nbsp;
                  <!-- <span class="fs-14">{{ item.pop }}</span> -->
                </div>
              </div>
            </div>
          </div>
          <div class="km-data-detail">
            <div
              class="km-dd-item"
              v-for="(item, index) in ksModuleData.list"
              :key="item.name"
            >
              <div>
                <span class="fs-20 fw-600 main-color">
                  <my-tooltip
                    :numData="numDataList.numList[index]"
                    :popData="numDataList.popList[index]"
                    tooltipBoxStyle="left: -70px;top:35px;width: 200px"
                  />
                  <!-- <CountTo
                    :startVal="startVal"
                    :endVal="Number(item.num)"
                    :decimals="item.decimals"
                    :duration="duration"
                  /> -->
                </span>
                <!-- ({{ item.unit }})&nbsp; -->
              </div>
              <div class="km-dd-item-img">
                <!-- <span class="fs-14 whitecolor">同比</span> -->
                <!-- <b v-if="item.radio === '-'">-</b>
                <b v-else>
                  <CountTo
                    :startVal="startVal"
                    :endVal="Number(item.radio)"
                    :decimals="2"
                    :duration="duration"
                  />%</b
                > -->
                <!-- <span v-if="item.radio !== '-'">
                  <img
                    v-if="item.radio < 0"
                    src="../../assets/common-new/red-down.png"
                    alt=""
                  />
                  <img
                    v-else
                    src="../../assets/common-new/green-top.png"
                    alt=""
                  />
                </span> -->
                <!-- <img src="../../assets/scjg-new/zdjg/num-bg2.png" alt="" /> -->
              </div>
              <div class="fs-16 fw-600">{{ item.name }}</div>
            </div>
          </div>
        </div>
      </div>

      <!-- 双随机监管 -->
      <div class="random-supervision">
        <div
          class="lm-top"
          :style="`background:url(${bgImg[2]});background-size: 100% 100%;`"
        ></div>
        <div class="rs-main">
          <!-- <div class="process">
            <div class="process-num"></div>
          </div> -->
          <!-- 双随机进度
          <div class="tip">
            <CountTo
              :startVal="startVal"
              :endVal="Number(processNum")
              :duration="duration"
            />%
          </div> -->
          <div class="num">
            <div>
              <img
                style="width: 10px; height: 10px; margin-right: 5px"
                src="../../assets/common-new/nation-icon.png"
                alt=""
              />
              <span>双随机进度</span>
            </div>
            <span class="main-color">
              <span class="fs-24 fw-600">
                <CountTo
                  :startVal="startVal"
                  :endVal="Number(doubleRandomPer)"
                  :decimals="2"
                  :duration="duration" /></span
              ><span class="fs-12">%</span>
            </span>
          </div>
          <div style="width: 100%">
            <el-progress
              :stroke-width="14"
              :percentage="doubleRandomPer"
            ></el-progress>
          </div>
        </div>
      </div>

      <!-- 无证户管理 -->
      <div class="un-household">
        <div
          class="lm-top"
          :style="`background:url(${bgImg[3]});background-size: 100% 100%;`"
        ></div>
        <div class="uh-main">
          <div
            class="uh-main-item"
            v-for="(item, index) in unHousehold"
            :key="index + 'index'"
          >
            <div>{{ item.name }}</div>
            <div class="num">
              <span class="fs-24">
                <my-tooltip
                  :numData="numDataList2.numList[index]"
                  :popData="numDataList2.popList[index]"
                  tooltipBoxStyle="left: -50px;top:35px;width: 150px"
                />
                <!-- <CountTo
                  :startVal="startVal"
                  :endVal="Number(item.statusAmount)"
                  :duration="duration"
              /> -->
              </span>
              <!-- <span class="white-color fs-14">({{ item.unit }})</span> -->
            </div>
            <div>
              <!-- <span class="unit">同比</span>&nbsp;
              <span class="percentage">
                <span v-if="item.radio === '-'">-</span>
                <span v-else>
                  <CountTo
                    :startVal="startVal"
                    :endVal="Number(item.radio)"
                    :decimals="2"
                    :duration="duration"
                  />%</span
                >
                <img
                  src="../../assets/common-new/green-top.png"
                  class="arrawtransform"
                  v-if="item.radio > 0"
                />
                <img
                  src="../../assets/common-new/red-down.png"
                  class="arrawtransform"
                  v-else
                />
              </span> -->
            </div>
          </div>
        </div>
      </div>
      <!-- <div class="title-cqwjc"></div>
      <div class="content">
        <div class="title">
          <div class="fw-600">地市局</div>
          <div class="fw-600">区县局</div>
          <div class="fw-600">计划执行人</div>
          <div class="fw-600">计划完成时间</div>
          <div class="fw-600">未完成户数</div>
        </div>
        <div class="num">
          <vue-seamless-scroll
            class="scroll-box"
            :data="uncheckData"
            :class-option="scrollOption"
          >
            <div v-for="(item, index) in uncheckData" class="item" :key="index">
              <div>{{ item.city_org_name }}</div>
              <div>{{ item.county_org_name }}</div>
              <div>{{ item.checkers }}</div>
              <div>{{ item.plan_finish_date }}</div>
              <div>{{ item.un_check_num }}</div>
            </div>
          </vue-seamless-scroll>
        </div>
      </div> -->

      <div class="title-wglshs"></div>
      <div class="content">
        <div class="title">
          <div class="fw-600">地市局</div>
          <div class="fw-600">区县局</div>
          <div class="fw-600">零售户姓名</div>
          <!-- <div class="fw-600">许可证号</div> -->
          <div class="fw-600">违规时间</div>
          <div class="fw-600">累计违规次数</div>
        </div>
        <div class="num">
          <vue-seamless-scroll
            class="scroll-box"
            :data="wglshsData"
            :class-option="scrollOption"
          >
            <div v-for="(item, index) in wglshsData" class="item" :key="index">
              <div>{{ item.city_org_name }}</div>
              <div>{{ item.county_org_name }}</div>
              <div>{{ item.manager_name }}</div>
              <!-- <div>{{ item.lic_no }}</div> -->
              <div>{{ item.check_time }}</div>
              <div>{{ item.wg_cnt }}</div>
            </div>
          </vue-seamless-scroll>
        </div>
      </div>
    </div>

    <!--中间 -->
    <div class="center-module">
      <!-- 地图 -->
      <div class="map-style">
        <custom-list 
           v-if="titleMap.level==1"
           position="left" 
           :title="listTitle2" 
           :columns="listColumns2" 
           :items="listItems2" 
        />
        <custom-list 
          v-if="titleMap.level==1"
          position="right" 
          :title="listTitle" 
          :columns="listColumns" 
          :items="listItems"
         />
        <div class="dflex width100per">
          <div class="maptableft" style="width: 100%">
            <!-- <div
              class="map-title" v-on:click="mapBack(titleMap)"
              :style="`background:url(${bgImg[9]});width:100%;height:40px;background-size: 100% 100% !important;`"
            ></div> -->
            <div class="map-title">
              <span
                style="margin-left: 10px"
                v-for="(item, index) in clickArea"
                :key="item"
              >
                <!-- <img src="../../assets/common-new/back.png" alt="" /> -->
                <div class="prov" @click="mapBack(index)">
                  {{ item }}
                  <span v-if="index != clickArea.length - 1"> / </span>
                </div>
              </span>
            </div>
          </div>
          <div class="maptabright" style="flex: 1">
            <div class="dflex" style="width: 100%; position: relative">
              <div
                class="fontsize14 dflex"
                style="
                  position: absolute;
                  right: 0;
                  top: 0;
                  align-items: center;
                  justify-content: flex-end;
                "
              >
                <!-- <div class="timebg">
                  {{ nowTime }}
                </div> -->
              </div>
            </div>
          </div>
        </div>
        <anhui-map
          :zoom="zoom"
          heightSet="500px"
          :data="data"
          :layoutCenter="['50%', '49%']"
          :formatterCustom="formatterCustom"
        ></anhui-map>
      </div>
      <div class="center-bottom-box">
        <!-- 全域监管 -->
        <div class="global-supervision">
          <div
            class="lm-top"
            :style="`background:url(${bgImg[4]});background-size: 100% 100%;`"
          ></div>
          <div class="gs-main">
            <!-- <global-supervision-first
            :gsfData="globalSuperData.networkData"
          ></global-supervision-first> -->
            <div style="position: absolute">
              <svg width="100%" height="100%">
                <defs>
                  <linearGradient
                    id="circle1"
                    x1="0%"
                    y1="0%"
                    x2="100%"
                    y2="0%"
                  >
                    <stop
                      offset="0%"
                      style="stop-color: #41bfd5"
                      stop-opacity="1"
                    ></stop>
                    <stop
                      offset="100%"
                      style="stop-color: #3c87a9"
                      stop-opacity="1"
                    ></stop>
                  </linearGradient>
                  <linearGradient
                    id="circle2"
                    x1="0%"
                    y1="0%"
                    x2="100%"
                    y2="0%"
                  >
                    <stop
                      offset="0%"
                      style="stop-color: #cab231"
                      stop-opacity="1"
                    ></stop>
                    <stop
                      offset="100%"
                      style="stop-color: #807d51"
                      stop-opacity="1"
                    ></stop>
                  </linearGradient>
                  <linearGradient
                    id="circle3"
                    x1="0%"
                    y1="0%"
                    x2="100%"
                    y2="0%"
                  >
                    <stop
                      offset="0%"
                      style="stop-color: #c1425d"
                      stop-opacity="1"
                    ></stop>
                    <stop
                      offset="100%"
                      style="stop-color: #8b4463"
                      stop-opacity="1"
                    ></stop>
                  </linearGradient>
                </defs>
              </svg>
            </div>
            <div class="gs-first">
              <div class="title">
                <img src="../../assets/scjg-new/qcjg/title2.png" alt="" />
              </div>
              <div class="content">
                <div
                  class="content-item"
                  v-for="(item, index) in globalSuperData.networkData"
                  :key="index"
                >
                  <div class="fw-600">{{ item.title }}</div>
                  <div>
                    <span v-if="item.num=='-'" class="fs-24 fw-600 main-color" >-</span>
                    <span v-else class="fs-24 fw-600 main-color"
                      ><CountTo
                        :startVal="startVal"
                        :endVal="Number(item.num)"
                        :duration="duration" />
                    </span>
                  </div>
                </div>
              </div>
            </div>
            <div class="dashboard">
              <div class="circle">
                <div class="circle-one">
                  <el-progress
                    :width="160"
                    type="circle"
                    :stroke-width="10"
                    :percentage="qyjg.list[0].per"
                  ></el-progress>
                </div>
                <div class="circle-two">
                  <el-progress
                    :width="120"
                    type="circle"
                    :stroke-width="10"
                    :percentage="qyjg.list[1].per"
                  ></el-progress>
                </div>
                <div class="circle-thr">
                  <el-progress
                    :width="80"
                    type="circle"
                    :stroke-width="10"
                    :percentage="qyjg.list[2].per"
                  ></el-progress>
                </div>
              </div>

              <div class="circle-intro">
                <div class="content">
                  <div
                    class="content-item"
                    v-for="(item, index) in qyjg.list"
                    :key="index"
                  >
                    <div
                      class="item-color"
                      :style="`background:${item.color}`"
                    ></div>
                    <div class="item-info">
                      <div class="info1">
                        <span class="fw-600">{{ item.perTitle }}</span>
                        <span :style="`color:${item.color}`"
                          >{{ item.per1 }}%</span
                        >
                      </div>
                      <div class="info2">
                        <span>{{ item.numTitle }}</span>
                        <span :style="`color:${item.color}`">{{
                          item.num
                        }}</span
                        >条
                      </div>
                    </div>
                  </div>
                </div>
              </div>
              <!-- <div v-for="item in globalSuperData.list" :key="item.id">
              <global-supervision-second
                :gsData="item"
              ></global-supervision-second>
              <div style="margin-left: 5px; font-size: 12px">
                {{ item.name }}:
                <CountTo
                  :startVal="startVal"
                  :endVal="Number(item.num)"
                  :duration="duration"
                />条
              </div>
            </div> -->
            </div>
            <!-- <div class="centerbotdiv2" style="width: 50%">
            <div class="lm-top">市场净化率</div>
            <img src="../../assets/new-feature/6.png" alt="" />
          </div> -->
          </div>
        </div>
        <!-- 市场净化率 -->
        <div class="market-pure-rate">
          <div
            class="lm-top"
            :style="`background:url(${bgImg[5]});background-size: 100% 100%;margin-bottom:0;height:50px`"
          ></div>
          <div id="jhl-box"></div>
        </div>
      </div>
    </div>

    <!-- 右侧边栏 -->
    <div class="right-module">
     
      <!-- 监管效能 -->
      <!-- <div class="er-effect-main">
        <div class="lm-top">监管效能</div>
        <div class="er-effect-detail">
          <div class="er-effect-detail-item">
            <er-effect
              v-for="(item, index) in regulatoryEffectData"
              :key="index + 'effect'"
              :ereData="item"
            ></er-effect>
          </div>
        </div>
      </div> -->
      <div class="jgxn-box">
        <div
          class="lm-top"
          :style="`background:url(${bgImg[6]});background-size: 100% 100% !important;`"
        ></div>
        <div class="main">
          <div class="content">
            <div class="btn" style="left: 10px;font-size: 14px;width:100%;margin-left:10px">
              <div
                :class="activeAjdbIndex === index ? 'btn-item-active' : 'btn-item'"
                v-for="(item, index) in ajdbBtn"
                :key="index"
                @click="toggleBtn(index)"
                style="width:33%"
              >
                {{ item }}
              </div>
            </div>
            <div v-if="activeAjdbIndex === 0">
              <div
                id="rjgf-box"
                key="rjgf"
                style="width: 480px; height: 170px;top: 10px; left: -20px;"
                >
             </div> 
            </div>
            <div v-if="activeAjdbIndex === 1">
                <div
                  id="rjcha-box"
                  key="rjcha"
                  style="width: 480px; height: 170px;top: 10px; left: -20px;"
                  >
              </div>
            </div>
            <div v-if="activeAjdbIndex === 2">
                <div
                  id="rjchj-box"
                  key="rjchj"
                  style="width: 480px; height: 170px;top: 10px; left: -20px;"
                  >
              </div>
            </div>
            <!-- <div
              class="content-item"
              v-for="(item, index) in regulatoryEffectData"
              :key="index"
            >
              <div class="title fs-14 fw-600">{{ item.name }}</div>
              <div class="num">
                <div
                  class="text"
                  :style="`background:url(${item.src});background-size: 100% 100%;`"
                >
                  <span class="fs-24 main-color fw-600" 
                 >
                    <my-tooltip
                      :numData="numDataList3.numList[index]"
                      :popData="numDataList3.popList[index]"
                      tooltipBoxStyle="left: -50px;top:40px;width: 300px;"
                    />
                  
                  </span>
                
                </div>
              
              </div>
            </div> -->
          </div>
        </div>
      </div>
      <!-- 智慧化管理所（站） -->
      <div class="wisdom-main">
        <div
          class="lm-top"
          :style="`background:url(${bgImg[7]});background-size: 100% 100% !important;`"
        ></div>
        <div class="wisdom-item">
          <div
            id="wisdom-box"
            style="width: 300px; height: 300px; top: -20px; left: -26px"
          ></div>
          <!-- <retail-format
            ref="retailFormat2"
            totStyle="color: #42c7de;font-size: 20px;font-weight: 600; top:107px; left:76px"
            :retailFormatData="wisdomData"
            :retailFormatEachrt="wisdomEachrt"
          ></retail-format>
           -->
          <div class="widom-data-detail">
            <div
              class="wd-item"
              v-for="(item, index) in wisdomData.echartsData"
              :key="index + 'index'"
            >
              <div
                class="icon"
                :style="{ background: `${item.background}` }"
              ></div>
              <div class="detail">
                <span class="fw-600">{{ item.name }}</span>
                <div class="num">
                  <span>
                    <span class="fs-20 fw-600 " :class="index? 'red-color' :'main-color'">
                      <!-- <my-tooltip
                        :numData="numDataList4.numList[index]"
                        :popData="numDataList4.popList[index]"
                        tooltipBoxStyle="left: -50px;top:40px;width: 150px"
                      /> -->
                      <CountTo
                        :startVal="startVal"
                        :endVal="Number(item.value)"
                        :duration="duration"
                      />
                    </span>
                    <span>(个)&nbsp;&nbsp;</span></span
                  >
                  <!-- <span>
                    <span>占比&nbsp;</span>
                    <span>
                      <span v-if="item.radio === '-'">-</span>
                      <span v-else>
                        <CountTo
                          :startVal="startVal"
                          :endVal="Number(item.radio)"
                          :decimals="2"
                          :duration="duration"
                        />%</span
                      ></span
                    >
                    </span
                  > -->
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>

      <!-- 信用监管 -->
      <!-- <div class="credit-supervision">
        <div
          class="lm-top"
          :style="`background:url(${bgImg[8]});background-size: 100% 100% !important;`"
        ></div>
        <div class="credit-supervision-item">
          <div class="cs-list">
            <cs-card
              v-for="(item, index) in creditSupervisionData.slice(0, 2)"
              :key="index + 'credit'"
              :csData="item"
            ></cs-card>
          </div>
          <div class="cs-list">
            <cs-card
              v-for="(item, index) in creditSupervisionData.slice(2, 4)"
              :key="index + 'credit'"
              :csData="item"
            ></cs-card>
          </div>
        </div>
      </div> -->
      <div class="xyjg-box">
        <div class="lftitlebg lftitlebg3"></div>
        <div class="content">
          <div
            class="content-item"
            v-for="(item, index) in NewXyjg.list"
            :key="index"
            :style="`background:url(${item.img})`"
          >
            <div class="title A-color" v-if="index === 0">
              <div class="type">
                <span class="fs-32">A</span>
                <span>类</span>
              </div>
              <div>(正常户)(户)</div>
            </div>
            <div class="title main-color" v-if="index === 1">
              <div class="type">
                <span class="fs-32 main-color">B</span>
                <span>类</span>
              </div>
              <div>(轻微违规)(户)</div>
            </div>
            <div class="title main-color" v-if="index === 2">
              <div class="type">
                <span class="fs-32 main-color">C</span>
                <span>类</span>
              </div>
              <div>(一般违规)(户)</div>
            </div>
            <div class="title D-color" v-if="index === 3">
              <div class="type">
                <span class="fs-32 D-color">D</span>
                <span>类</span>
              </div>
              <div>(严重违规)(户)</div>
            </div>
            <!-- 类别 -->
            <div class="num">
              <div class="text fs-24 fw-600">
                <my-tooltip
                  :numData="numDataList5.numList[index]"
                  :popData="numDataList5.popList[index]"
                  tooltipBoxStyle="left: -60px;top:30px;width: 150px"
                />
                <!-- <span class="fs-24 fw-600">
                  <CountTo
                    :startVal="0"
                    :endVal="Number(item.num)"
                    :duration="3000"
                /></span>
                <span>（户）</span> -->
              </div>
              <!-- <div class="per">
                <span
                  >占比
                  <CountTo
                    :startVal="0"
                    :endVal="Number(item.per)"
                    :decimals="2"
                    :duration="3000"
                  />%&nbsp;&nbsp;</span
                > -->
              <!-- <span>同比{{ item.per2 }}%</span> -->
              <!-- </div> -->
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
var indexData = {
  processNum: 44,

  // 全域监管
  globalSuperData: {
    networkData: [
      {
        title: "综治网格(个)",
        num: 1785,
      },
      {
        title: "警务网格(个)",
        num: 1516,
      },
      {
        title: "烟草网格(个)",
        num: 1055,
      },
    ],
    list: [
      {
        name: "三网融合派单",
        num: 5141,
        radio: 91.22,
        radioName: "有效信息率",
        id: "gs-second0",
      },
      {
        name: "三员协同派单",
        num: 32708,
        radio: 95.02,
        radioName: "有价信息率",
        id: "gs-second1",
      },
      {
        name: "三岗联动派单",
        num: 3146,
        radio: 90.88,
        radioName: "形成案件率",
        id: "gs-second2",
      },
    ],
  },
  // 智慧化管理所
  wisdomData: {
    businessName: "智慧化管理所",
    totalNum: 10,
    totalName: "总数",
    echartsData: [
      {
        value: 10,
        name: "标准化专门管理所(站)",
        radio: 92,
        background: "#42c7de",
        itemStyle: {
          // borderRadius: "10%",
          color: {
            type: "linear",
            colorStops: [
              {
                offset: 0,
                color: "#42c7de",
              },
              {
                offset: 1,
                color: "#298cb1",
              },
            ],
          }, //圆环颜色
        },
      },
      {
        value: 5,
        name: "标杆专卖管理所（站）",
        radio: 80.4,
        background: "#04c375",
        itemStyle: {
          // borderRadius: "10%",
          color: {
            type: "linear",
            colorStops: [
              {
                offset: 0,
                color: "#74436a",
              },
              {
                offset: 1,
                color: "#04c375",
              },
            ],
          }, //圆环颜色
        },
      },
    ],
  },
};
import retailFormat from "@/components/regulation/retailFormat";
import keySupervision from "@/components/regulation/keySupervision";
import mapModule from "@/components/regulation/mapModule";
import globalSupervisionFirst from "@/components/regulation/globalSupervisionFirst";
import globalSupervisionSecond from "@/components/regulation/globalSupervisionSecond";
import erEffect from "@/components/regulation/erEffect";
import csCard from "@/components/regulation/csCard";
import anhuiMap from "@/components/echart/anhuiMap";
import axios from "axios";
import { getHomeScjgSchema } from "@/api/qjzl.js";
import {getShortName} from '@/utils/convertName.js'
import {
  getRetailTotal,
  getZdjgNum,
  getRandomProcessRadio,
  getUnlicNum,
  getLicLevel,
  getJgxnNum,
  getAverageCigarNum,
  getAverageCaseNum,
  getDiscoverNum,
  getMapData,
  getCheckNumData,
  getOrgRandRomRanking,
  getMarketBmkData,
  getAvgAdminLicNum,
  getThreeNetFusion,
  getBenchMarkTeamStatData,
  getWglsh, 
} from "@/api/market.js";
import timePicker from "@/components/timePicker/index.vue";
import CustomList from "@/components/mapList/mapList.vue";

export default {
  data() {
    return {
      isShow:false,
      listTitle: "",
      listColumns: [],
      listItems: [
    ],
    listTitle2: "",
      listColumns2: [],
      listItems2: [
    ],
      //弹窗
      numDataList: {
        numList: [],
        popList: [],
      },
      numDataList2: {
        numList: [],
        popList: [],
      },
      numDataList3: {
        numList: [],
        popList: [],
      },
      numDataList4: {
        numList: [],
        popList: [],
      },
      numDataList5: {
        numList: [],
        popList: [],
      },

      //地图区域
      placeList: [
        {
          name: "合肥市",
          value: [117.227239, 31.820587],
          isActive: false,
        },
      ],
      clickArea: ["安徽省"],
      titleMap: {
        name: "安徽省",
        uuid: "00000000000000000000000011340001",
        level: 1,
        oldName: "安徽省",
        countyUuid: "",
      },
      dataMaps: {
        安徽省: 340000,
        合肥市: 340100,
        瑶海区: 340102,
        庐阳区: 340103,
        蜀山区: 340104,
        包河区: 340111,
        长丰县: 340121,
        肥东县: 340122,
        肥西县: 340123,
        庐江县: 340124,
        巢湖市: 340181,
        芜湖市: 340200,
        镜湖区: 340202,
        鸠江区: 340207,
        弋江区: 340209,
        湾沚区: 340210,
        繁昌区: 340211,
        南陵县: 340223,
        无为市: 340281,
        蚌埠市: 340300,
        龙子湖区: 340302,
        蚌山区: 340303,
        禹会区: 340304,
        淮上区: 340311,
        怀远县: 340321,
        五河县: 340322,
        固镇县: 340323,
        淮南市: 340400,
        大通区: 340402,
        田家庵区: 340403,
        谢家集区: 340404,
        八公山区: 340405,
        潘集区: 340406,
        凤台县: 340421,
        寿县: 340422,
        马鞍山市: 340500,
        花山区: 340503,
        雨山区: 340504,
        博望区: 340506,
        当涂县: 340521,
        含山县: 340522,
        和县: 340523,
        淮北市: 340600,
        杜集区: 340602,
        相山区: 340603,
        烈山区: 340604,
        濉溪县: 340621,
        铜陵市: 340700,
        铜官区: 340705,
        义安区: 340706,
        郊区: 340711,
        枞阳县: 340722,
        安庆市: 340800,
        迎江区: 340802,
        大观区: 340803,
        宜秀区: 340811,
        怀宁县: 340822,
        太湖县: 340825,
        宿松县: 340826,
        望江县: 340827,
        岳西县: 340828,
        桐城市: 340881,
        潜山市: 340882,
        黄山市: 341000,
        屯溪区: 341002,
        黄山区: 341003,
        徽州区: 341004,
        歙县: 341021,
        休宁县: 341022,
        黟县: 341023,
        祁门县: 341024,
        滁州市: 341100,
        琅琊区: 341102,
        南谯区: 341103,
        来安县: 341122,
        全椒县: 341124,
        定远县: 341125,
        凤阳县: 341126,
        天长市: 341181,
        明光市: 341182,
        阜阳市: 341200,
        颍州区: 341202,
        颍东区: 341203,
        颍泉区: 341204,
        临泉县: 341221,
        太和县: 341222,
        阜南县: 341225,
        颍上县: 341226,
        界首市: 341282,
        宿州市: 341300,
        埇桥区: 341302,
        砀山县: 341321,
        萧县: 341322,
        灵璧县: 341323,
        泗县: 341324,
        六安市: 341500,
        金安区: 341502,
        裕安区: 341503,
        叶集区: 341504,
        霍邱县: 341522,
        舒城县: 341523,
        金寨县: 341524,
        霍山县: 341525,
        亳州市: 341600,
        谯城区: 341602,
        涡阳县: 341621,
        蒙城县: 341622,
        利辛县: 341623,
        池州市: 341700,
        贵池区: 341702,
        东至县: 341721,
        石台县: 341722,
        青阳县: 341723,
        宣城市: 341800,
        宣州区: 341802,
        郎溪县: 341821,
        泾县: 341823,
        绩溪县: 341824,
        旌德县: 341825,
        宁国市: 341881,
        广德市: 341882,
      },
      dataMap: require("../../mapdata/anhui/anhui.json"),
      // new
      // 案发率
      aflYData: [],
      aflXData: [],
      // 零售业态
      // retailFormatData: {
      //   businessName: "零售业态",
      //   totalNum: 1,
      //   totalName: "总户数",

      //   echartsData: [],
      // },
      // 重点监管
      ksModuleData: {
        // 命中
        superviseEchart: {
          // color: "#4992FF",
          colorStops: [
            {
              offset: 0,
              color: "#d2b831",
            },
            {
              offset: 1,
              color: "#868c5d",
            },
          ],
          pieTit: "重点监管\n命中率",
          pieNum: "0",
          // pievideo: "600",
        },
        // 监管
        hitEchart: {
          // color: "#FFB649",
          colorStops: [
            {
              offset: 0,
              color: "#05bf75",
            },
            {
              offset: 1,
              color: "#1d9681",
            },
          ],
          pieTit: "日监管进度",
          pieNum: "0",
          // pievideo: "150",
          titleitemGap: 8,
        },
        totalList: [
          {
            name: "出动人次",
            num: 0,
            pop: "(人)",
          },
          {
            name: "检查户数",
            num: 0,
            pop: "(户)",
          },
        ],
        list: [
          {
            name: "异常户数",
            num: 0,
            radio: 0,
            unit: "户",
          },
          {
            name: "查获案件",
            unit: "起",
            num: 0,
            radio: 0,
          },
          {
            name: "查获卷烟",
            unit: "万支",
            num: 0,
            radio: 0,
          },
        ],
      },
      // 双随机
      doubleRandomPer: 0,
      // 无证户管理
      unHousehold: [
        {
          name: "无证户总数",
          statusAmount: 0,
          radio: 0,
          unit: "户",
        },
        {
          name: "新增户数",
          statusAmount: 0,
          radio: 0,
          unit: "户",
        },
        {
          name: "取缔户数",
          statusAmount: 0,
          radio: 0,
          unit: "户",
        },
      ],
      uncheckData: [
        {
          city_org_name: "",
          county_org_name: "",
          checkers: "",
          plan_finish_date: "",
          un_check_num: "",
        },
      ],
      //一年内两次及以上违规零售户数
      wglshsData: [
        {
          city_org_name: "",
          county_org_name: "",
          manager_name: "",
          lic_no: "",
          check_time: "",
          wg_cnt: "",
        },
      ],
      // 监管效能
      activeAjdbIndex:0,
      ajdbBtn: ["人均管服(户)",
      //  "人均检查(户)", 
       "人均查获(起)",
       "人均查获(万支)"],
      marketBmkData:[],
      regulatoryEffectData: [
        {
          name: "人均管服户数",
          num: 0,
          unit: "户",
          radio: 1.87,
          src: require("../../assets/scjg-new/jgxn/title1.png"),
        },
        // {
        //   name: "人均检查户数",
        //   num: 0,
        //   unit: "户",
        //   radio: 0,
        //   src: require("../../assets/scjg-new/jgxn/title2.png"),
        // },
        {
          name: "人均查获案件数",
          num: 0,
          unit: "起",
          radio: 1.72,
          src: require("../../assets/scjg-new/jgxn/title3.png"),
        },
        {
          name: "人均查获卷烟数",
          num: 0,
          unit: "万支",
          radio: 0,
          src: require("../../assets/scjg-new/jgxn/title4.png"),
        },
      ],
      bgImg: [
        require("../../assets/scjg-new/lsyt/title.png"),
        require("../../assets/scjg-new/zdjg/title.png"),
        require("../../assets/scjg-new/ssj/title.png"),
        require("../../assets/scjg-new/wzhgl/title.png"),
        require("../../assets/scjg-new/qcjg/title.png"),
        require("../../assets/scjg-new/scjh/title.png"),
        require("../../assets/scjg-new/jgxn/title-db.png"),
        require("../../assets/scjg-new/zhhgls/title.png"),
        require("../../assets/scjg-new/xyjg/title.png"),
        require("../../assets/scjg-new/title.png"),
      ],

      qyjg: {
        list: [
          {
            per: 91.22,
            perTitle: "有效信息率:",
            color: "#41bfd5",
            num: 5141,
            numTitle: "三网融合派单:",
          },
          {
            per: 95.02,
            perTitle: "有价信息率:",
            color: "#cab231",
            num: 32708,
            numTitle: "三员融合派单:",
          },
          {
            per: 90.88,
            perTitle: "形成案件率:",
            color: "#c3445c",
            num: 3148,
            numTitle: "三岗融合派单:",
          },
        ],
      },
      NewXyjg: {
        list: [
          {
            level: "A",
            num: 0,
            per: 0,
            per2: 0,
            img: require("../../assets/scjg-new/xyjg/A.png"),
          },
          {
            level: "B",
            num: 0,
            per: 0,
            per2: 0,
            img: require("../../assets/scjg-new/xyjg/B.png"),
          },
          {
            level: "C",
            num: 0,
            per: 0,
            per2: 0,
            img: require("../../assets/scjg-new/xyjg/C.png"),
          },
          {
            level: "D",
            num: 0,
            per: 0,
            per2: 0,
            img: require("../../assets/scjg-new/xyjg/D.png"),
          },
        ],
      },
      // old
      nowDate: null,
      nowTime: null,
      timer: "",
      currentTime: new Date(),
      defaultDate: [
        "2023-01-01",
        new Date().toLocaleDateString().replace(/\//g, "-"),
      ],
      ...indexData,
      startVal: 0,
      duration: 3000,
      zoom: 1.2,
      // retailFormatEachrt: {
      //   pieX: "25%",
      //   pieY: "48%",
      //   pieWidth: "70%",
      //   pieHeight: "95%",
      //   textTop: "35%",
      //   textLeft: "23%",
      //   legend: {
      //     // bottom: "5%",
      //     right: "5%",
      //     orient: "vertical",
      //     textStyle: {
      //       color: "#fff",
      //       rich: {
      //         title: {
      //           color: "#34EFFE",
      //           fontWeight: 600,
      //         },
      //       },
      //     },
      //   },
      // },
      wisdomEachrt: {
        pieX: "25%",
        pieY: "50%",
        pieWidth: "55%",
        pieHeight: "80%",
        textTop: "40%",
        textLeft: "24%",
        legend: {
          show: false,
        },
      },
      data: [
        {
          name: "合肥市",
          value: "50.62",
          value1: "0.39",
          value2: "1.76",
        },
        {
          name: "安庆市",
          value: "6.25",
          value1: "0.56",
          value2: "0.58",
        },
        {
          name: "蚌埠市",
          value: "10.86",
          value1: "0.35",
          value2: "1.25",
        },
        {
          name: "阜阳市",
          value: "20.38",
          value1: "0.67",
          value2: "1.28",
        },
        {
          name: "亳州市",
          value: "45.71",
          value1: "0.64",
          value2: "0.77",
        },
        {
          name: "池州市",
          value: "62.10",
          value1: "0.30",
          value2: "0.48",
        },
        {
          name: "滁州市",
          value: "16.29",
          value1: "0.42",
          value2: "0.99",
        },
        {
          name: "淮北市",
          value: "23.36",
          value1: "0.34",
          value2: "0.59",
        },
        {
          name: "淮南市",
          value: "16.7",
          value1: "0.59",
          value2: "0.96",
        },
        {
          name: "黄山市",
          value: "25.5",
          value1: "0.29",
          value2: "0.09",
        },
        {
          name: "六安市",
          value: "12.44",
          value1: "0.47",
          value2: "0.49",
        },
        {
          name: "宿州市",
          value: "74.67",
          value1: "0.55",
          value2: "0.69",
        },
        {
          name: "铜陵市",
          value: "16.71",
          value1: "0.32",
          value2: "0.28",
        },
        {
          name: "芜湖市",
          value: "10.32",
          value1: "0.84",
          value2: "0.72",
        },
        {
          name: "宣城市",
          value: "26.13",
          value1: "0.23",
          value2: "0.63",
        },
        {
          name: "马鞍山市",
          value: "33.5",
          value1: "0.37",
          value2: "0.38",
        },
      ],
      picktimeTemp: {},
    };
  },
  computed: {
    scrollOption() {
      return {
        step: 0.2,
        hoverStop: true, // 是否开启鼠标悬停stop
        direction: 1, // 0向下 1向上 2向左 3向右
        openWatch: true, // 开启数据实时监控刷新dom
        singleHeight: 48, // 单步运动停止的高度(默认值0是无缝不停止的滚动) direction => 0/1
        waitTime: 20, // 单步运动停止的时间(默认值1000ms)
      };
    },
  },
  components: {
    retailFormat,
    keySupervision,
    mapModule,
    globalSupervisionFirst,
    globalSupervisionSecond,
    erEffect,
    csCard,
    anhuiMap,
    timePicker,
    CustomList,
  },
  metaInfo: {
    meta: [{ name: "referrer", content: "no-referrer" }],
  },
  created() {
    // this.initData(
    //   "prov_org_uuid",
    //   "00000000000000000000000011340001",
    //   "安徽省"
    // );
  },
  mounted() {
    // this.initwisdomChart();
    // let _this = this;
    // window.addEventListener("setItemEvent", (event) => {
    //   if (event.key === "PICKTIME") {
    //     // console.log(event.newValue);
    //     _this.picktimeTemp = JSON.parse(event.newValue);
    //     if (_this.titleMap.level === 1) {
    //       _this.initData(
    //         "prov_org_uuid",
    //         "00000000000000000000000011340001",
    //         "安徽省"
    //       );
    //     } else if (_this.titleMap.level === 2) {
    //       _this.initData(
    //         "city_org_uuid",
    //         _this.titleMap.uuid,
    //         _this.titleMap.name
    //       );
    //     } else {
    //       _this.initData(
    //         "county_org_uuid",
    //         _this.titleMap.uuid,
    //         _this.titleMap.name
    //       );
    //     }
    //   }
    // });
    // this.barInit("jhl-box");
  },
  methods: {
    //监管能效切换
    toggleBtn(i) {
      // 案件对标数据按钮
      this.activeAjdbIndex = i;
      this.$nextTick(() => {
        if (!i) {
          // 人均管服
          this.barInit2("rjgf-box");
        }
        else if (i === 1) {
          // 人均查获（起）
          this.barInit2("rjcha-box");
        }
        else if (i === 2) {
          // 人均查获（万支）
          this.barInit2("rjchj-box");
        }
      });
    },
    initwisdomChart() {
      console.log(1111);

      let myChart = this.$echarts.init(document.getElementById("wisdom-box"));
      var data = {
        name: "标杆占比",
        value: Number(((this.wisdomData.echartsData[1].value/this.wisdomData.echartsData[0].value)*100).toFixed(2)),
      };
      console.log('132',data);
      let option = {
        //你的代码
        title: {
          text:`${data.name}\n${data.value}%`,
          textStyle: {
            color: "#04c375",
            fontSize: 20,
          },
          left: "center",
          top: "center",
        },
        tooltip: {
          formatter: function (params) {
            return (
              '<span style="color: #000;">占比：' + params.value + "%</span>"
            );
          },
        },
        angleAxis: {
          max: 100,
          clockwise: false, // 逆时针
          // 隐藏刻度线
          show: false,
          startAngle: 110,
        },
        radiusAxis: {
          type: "category",
          show: true,
          axisLabel: {
            show: false,
          },
          axisLine: {
            show: false,
          },
          axisTick: {
            show: false,
          },
        },
        polar: [
          {
            center: ["50%", "50%"], //中心点位置
            radius: "100%", //图形大小
          },
        ],
        series: [
          {
            type: "bar",
            z: 10,
            data: [data.value],
            showBackground: false,
            coordinateSystem: "polar",
            roundCap: false,
            barWidth: 25, //大的占比环
            itemStyle: {
              normal: {
                opacity: 1,
                color: "#04c375",
              },
            },
          },
          {
            type: "pie",
            name: "内层细圆环",
            radius: ["45%", "55%"],
            startAngle: 110,
            hoverAnimation: false,
            clockWise: true,
            itemStyle: {
              borderColor: "#41c7de",
              borderWidth: 1.5,
              shadowColor: "#41c7de",
              shadowOffsetx: 25,
              shadowOffsety: 20,
              color: "#41c7de",
            },
            tooltip: {
              show: false,
            },
            label: {
              show: false,
            },
            data: [100],
          },
        ],
      };

      myChart.showLoading();
      this.$nextTick(() => {
        // 初始化地图
        myChart.setOption(option, false);
        myChart.resize();
        myChart.hideLoading();
      });
    },
    timeChangeFn(timeObj) {
      console.log(timeObj, "timeobj------------");
      this.picktimeTemp = timeObj;
      if (this.titleMap.level === 1) {
        this.initData(
          "prov_org_uuid",
          "00000000000000000000000011340001",
          "安徽省"
        );
      } else if (this.titleMap.level === 2) {
        this.initData("city_org_uuid", this.titleMap.uuid, this.titleMap.name);
      } else {
        this.initData(
          "county_org_uuid",
          this.titleMap.uuid,
          this.titleMap.name
        );
      }
    },
    // 地图返回
    mapBack(index) {
      let that = this;
      that.titleMap.level = index + 1;

      if (that.titleMap.level == 1) {
        that.clickArea = [];
        that.titleMap.name = "安徽省";
        that.titleMap.uuid = "00000000000000000000000011340001";
        that.clickArea.push(that.titleMap.name);
        console.log(that.titleMap, "地图返回,");
        that.initData("prov_org_uuid", that.titleMap.uuid, that.titleMap.name);
      } else if (that.titleMap.level == 2) {
        console.log(that.titleMap, "返回地市");
        if (that.titleMap.level < that.clickArea.length) that.clickArea.pop();
        if (that.clickArea.length == 3) that.clickArea.pop();
        that.initData(
          "city_org_uuid",
          that.titleMap.uuid,
          that.titleMap.oldName
        );
      } else if (that.titleMap.level == 3) {
        if (that.clickArea.length == 4) that.clickArea.pop();
        console.log(that.titleMap, "返回县区");
        that.initData(
          "county_org_uuid",
          that.titleMap.countyUuid,
          that.titleMap.name
        );
      }
    },
    //初始化数据
    initData(columnName, orgUuid, name) {
      console.log('55555',columnName, orgUuid, name,this.titleMap,this.clickArea.length);
      let that = this;
      this.timer = setInterval(this.getTime, 1000);
      const req1 = getRetailTotal({
        ...that.picktimeTemp,
        columnName,
        orgUuid,
      });
      const req2 = getZdjgNum({
        ...that.picktimeTemp,
        columnName,
        orgUuid,
      });
       let req3=null
      if(this.clickArea.length<= 3){
         req3 = getRandomProcessRadio({
        ...that.picktimeTemp,
        columnName,
        orgUuid,
      });
      }else{
        req3 = getRandomProcessRadio({
        ...that.picktimeTemp,
        columnName:'county_org_uuid',
        orgUuid:this.titleMap.countyUuid,
      });
      }
     
      const req4 = getUnlicNum({
        ...that.picktimeTemp,
        columnName,
        orgUuid,
      });
      const req5 = getLicLevel({
        ...that.picktimeTemp,
        columnName,
        orgUuid,
      });
      const req6 = getJgxnNum({
        ...that.picktimeTemp,
        columnName,
        orgUuid,
      });
      const req7 = getAverageCigarNum({
        ...that.picktimeTemp,
        columnName,
        orgUuid,
      });
      const req8 = getAverageCaseNum({
        ...that.picktimeTemp,
        columnName,
        orgUuid,
      });
      let req9=null
      if(that.titleMap.level <=2){
       req9 = getDiscoverNum({
        ...that.picktimeTemp,
        columnName,
        orgUuid,
      });
     }else{
       req9 = getDiscoverNum({
         ...that.picktimeTemp,
         columnName:'city_org_uuid',
         orgUuid:this.titleMap.uuid,
       });
     }
      const req10 = getMapData({
        ...that.picktimeTemp,
        columnName,
        orgUuid,
      });
      const req11 = getHomeScjgSchema({
        ...that.picktimeTemp,
        columnName,
        orgUuid,
      });
      const req12 = getCheckNumData({
        ...that.picktimeTemp,
        columnName,
        orgUuid,
      });
      const req13 = getOrgRandRomRanking({
        ...that.picktimeTemp,
        columnName,
        orgUuid,
      });
      let req14 = null
      if(that.titleMap.level==1){
          req14= getMarketBmkData({
          ...that.picktimeTemp,
          year:that.picktimeTemp.endDate.split("-")[0],
          month:parseInt(that.picktimeTemp.endDate.split("-")[1])-1,
          columnName,
          orgUuid,
        });
      }else if(that.titleMap.level==2){
        req14= getAvgAdminLicNum({
          ...that.picktimeTemp,
          columnName1:'city_org_name',
          columnName2:'city_org_uuid',
          columnName3:'prov_org_uuid',
        });
      }else{
        req14= getAvgAdminLicNum({
          ...that.picktimeTemp,
          columnName1:'county_org_name',
          columnName2:'county_org_uuid',
          columnName3:'city_org_uuid',
          orgUuid:that.titleMap.uuid,
        });
      }
      let Clevel= 'prov'
      if(that.titleMap.level == 1){
        Clevel= 'prov'
      }else if(that.titleMap.level == 2){
        Clevel= 'city'
      }else if(that.titleMap.level == 3&&this.clickArea.length== 3){
        Clevel= 'county'
      }else{
        Clevel='team'
      }
      let req15= getThreeNetFusion({
          level:Clevel,
          orgUuid,
        });
      let req16 = getBenchMarkTeamStatData({
          level:Clevel,
          orgUuid,
      })
      const req17 = getWglsh({
        ...that.picktimeTemp,
        columnName,
        orgUuid,
      });
     
      Promise.all([
        req1,
        req2,
        req3,
        req4,
        req5,
        req6,
        req7,
        req8,
        req9,
        req10,
        req11,
        req12,
        req13,
        req14,
        req15,
        req16,
        req17,
      ])
        .then(function (results) {
          // 零售业态
          // const data1 = results[0];
          // console.log(data1, "零售业态");
          // that.retailFormatData.totalNum = !data1.formatNum.data.length
          //   ? 0
          //   : data1.formatNum.data[0].num;
          // that.retailFormatData.echartsData = data1.totalNum.data;
          // that.retailFormatData.echartsData.forEach((k) => {
          //   k.name = k.bizName;
          //   k.value = k.bizNums;
          // });
          // that.retailFormatEachrt.legend.formatter = function (name) {
          //   return (
          //     name +
          //     `{title| ${
          //       that.retailFormatData.echartsData.find((k) => k.name === name)
          //         ?.value
          //     }   }`
          //   );
          // };
          // that.retailFormatData.echartsData.sort((star, next) => {
          //   return star.value - next.value;
          //   // return next.value - star.value;
          // });
          // that.retailFormatData.echartsData.push(
          //   ...that.retailFormatData.echartsData.splice(
          //     that.retailFormatData.echartsData.findIndex(
          //       (k) => k.name === "其他"
          //     ),
          //     1
          //   )
          // );
          // that.$refs["retailFormat"].echartsInit();
          // 重点监管

          const data2 = results[1];
          const data9 = results[8];
          console.log(data2, "重点监管1");
          console.log(data9, "重点监管2");
          // 净化率
          // that.aflXData = data9.caseAvg.data.map((k) =>
          //   that.titleMap.level != 1
          //     ? k.orgName
          //         .replace("烟草专卖局", "")
          //         .replace("合肥市", "")
          //         .replace("黄山市", "")
          //         .replace("芜湖市", "")
          //         .replace("安徽省", "")
          //     : k.orgName.replace("烟草专卖局", "")
          // );
          if(that.titleMap.level != 1){
            that.aflXData =  data9.caseAvg.data.map((k) =>{
           return getShortName(k.orgName)
          })
          }else{
            that.aflXData =  data9.caseAvg.data.map((k) =>{
           return k.orgName
          })
          }
        
          console.log('that.aflXData',that.aflXData);
          that.aflYData = data9.caseAvg.data.map((k) => k.num);

          that.barInit("jhl-box");
          //
          that.ksModuleData.superviseEchart.pieNum = !data2.hitRadio.data.length
            ? 0
            : data2.hitRadio.data[0].checkRate;
          //that.ksModuleData.hitEchart.pieNum = 98.47;
          that.ksModuleData.hitEchart.pieNum = !data2.supervisionProcess.data
            .length
            ? 0
            : data2.supervisionProcess.data[0].num;
          // 出动人次 检查户数

          that.ksModuleData.totalList = [
            {
              name: data2.outPersonTimes.name + "(人)",
              num: !data2.outPersonTimes.data.length
                ? 0
                : data2.outPersonTimes.data[0].num,
              // num: 30098,
              pop: "(人)",
            },
            {
              name: data2.checkLicNum.name + "(户)",
              num: !data2.checkLicNum.data.length
                ? 0
                : data2.checkLicNum.data[0].num,
              //  num: 209009,
              pop: "(户)",
            },
          ];
          // 异常户数 查获案件 查获卷烟
          that.numDataList.numList = [];
          that.numDataList.numList.push({
            num: !data2.abnormalLicYearOnYear.data.length
              ? 0
              : data2.abnormalLicYearOnYear.data[0].num,
            decimals: 0,
            suffix: "",
          });
          that.numDataList.numList.push({
            num: !data9.caseNum.data.length ? 0 : data9.caseNum.data[0].num,
            decimals: 0,
            suffix: "",
          });
          that.numDataList.numList.push({
            num: !data9.qtyNum.data.length ? 0 : data9.qtyNum.data[0].num,
            decimals: 0,
            suffix: "",
          });
          that.numDataList.popList = [];
          that.numDataList.popList.push([
            {
              label: "同比",
              value: !data2.abnormalLicYearOnYear.data.length
                ? "-"
                : data2.abnormalLicYearOnYear.data[0].yearOnYear,
              imgSrc: !data2.abnormalLicYearOnYear.data.length
                ? "-"
                : data2.abnormalLicYearOnYear.data[0].yearOnYear > 0
                ? require("../../assets/common-new/green-top.png")
                : require("../../assets/common-new/red-down.png"),
              unit: "%",
              color: !data2.abnormalLicYearOnYear.data.length
                ? "-"
                : data2.abnormalLicYearOnYear.data[0].yearOnYear > 0
                ? "safe-color"
                : "danger-color",
            },
          ]);
          that.numDataList.popList.push([
            {
              label: "同比",
              value: !data9.caseNum.data.length
                ? "-"
                : data9.caseNum.data[0].yearOnYear,
              imgSrc: !data9.caseNum.data.length
                ? "-"
                : data9.caseNum.data[0].yearOnYear > 0
                ? require("../../assets/common-new/green-top.png")
                : require("../../assets/common-new/red-down.png"),
              unit: "%",
              color: !data9.caseNum.data.length
                ? "-"
                : data9.caseNum.data[0].yearOnYear > 0
                ? "safe-color"
                : "danger-color",
            },
          ]);
          that.numDataList.popList.push([
            {
              label: "同比",
              value: !data9.qtyNum.data.length
                ? "-"
                : data9.qtyNum.data[0].yearOnYear,
              imgSrc: !data9.qtyNum.data.length
                ? "-"
                : data9.qtyNum.data[0].yearOnYear > 0
                ? require("../../assets/common-new/green-top.png")
                : require("../../assets/common-new/red-down.png"),
              unit: "%",
              color: !data9.qtyNum.data.length
                ? "-"
                : data9.qtyNum.data[0].yearOnYear > 0
                ? "safe-color"
                : "danger-color",
            },
          ]);

          that.ksModuleData.list = [
            {
              name: "异常户数(户)",
              decimals: 0,
              //num: 425,
              //radio: 10.97,
              num: !data2.abnormalLicYearOnYear.data.length
                ? 0
                : data2.abnormalLicYearOnYear.data[0].num,
              radio: !data2.abnormalLicYearOnYear.data.length
                ? "-"
                : data2.abnormalLicYearOnYear.data[0].yearOnYear,
              unit: "户",
            },
            {
              name: "查获案件(起)",
              unit: "起",
              decimals: 0,
              num: !data9.caseNum.data.length ? 0 : data9.caseNum.data[0].num,
              radio: !data9.caseNum.data.length
                ? "-"
                : data9.caseNum.data[0].yearOnYear,
            },
            {
              name: "查获卷烟(万支)",
              unit: "万支",
              decimals: 2,
              num: !data9.qtyNum.data.length ? 0 : data9.qtyNum.data[0].num,
              radio: !data9.qtyNum.data.length
                ? "-"
                : data9.qtyNum.data[0].yearOnYear,
            },
          ];
          that.$refs["keySupervision1"].echartsInit();
          that.$refs["keySupervision2"].echartsInit();
          // 双随机
          const data3 = results[2];
          console.log(data3, "双随机");
          that.doubleRandomPer = !data3.randomProcessRadio?.data.length
            ? 0
            : parseInt(data3.randomProcessRadio.data[0]?.process ?? 0);
          // 无证户
          const data4 = results[3];
          console.log(data4, "无证户");
          that.numDataList2.numList = [];
          that.numDataList2.numList.push({
            num: !data4.unlicTotalNumYearonyear.data.length
              ? 0
              : data4.unlicTotalNumYearonyear.data[0].newNums,
            decimals: 0,
            suffix: "",
          });
          that.numDataList2.numList.push({
            num: !data4.unlicAddNumYearonyear.data.length
              ? 0
              : data4.unlicAddNumYearonyear.data[0].newNums,
            decimals: 0,
            suffix: "",
          });
          that.numDataList2.numList.push({
            num: !data4.unlicBanNumYearonyear.data.length
              ? 0
              : data4.unlicBanNumYearonyear.data[0].banNums,
            decimals: 0,

            suffix: "",
          });
          that.numDataList2.popList = [];
          that.numDataList2.popList.push([
            {
              label: "同比",
              value: !data4.unlicTotalNumYearonyear.data.length
                ? "-"
                : data4.unlicTotalNumYearonyear.data[0].t_limit,
              // imgSrc:
              // !data4.unlicTotalNumYearonyear.data.length
              // ? "-"
              // : data4.unlicTotalNumYearonyear.data[0].t_limit > 0
              //     ? require("../../assets/common-new/green-top.png")
              //     : require("../../assets/common-new/red-down.png"),
              unit: "%",
              color: "main-color",
            },
          ]);
          that.numDataList2.popList.push([
            {
              label: "同比",
              value: !data4.unlicAddNumYearonyear.data.length
                ? "-"
                : data4.unlicAddNumYearonyear.data[0].yearOnYear,
              // imgSrc:
              // !data4.unlicAddNumYearonyear.data.length
              // ? "-"
              // : data4.unlicAddNumYearonyear.data[0].yearOnYear > 0
              //     ? require("../../assets/common-new/green-top.png")
              //     : require("../../assets/common-new/red-down.png"),
              unit: "%",
              color: "main-color",
            },
          ]);
          that.numDataList2.popList.push([
            {
              label: "同比",
              value: !data4.unlicBanNumYearonyear.data.length
                ? "-"
                : data4.unlicBanNumYearonyear.data[0].yearOnYear,
              // imgSrc:
              // !data4.unlicBanNumYearonyear.data.length
              // ? "-"
              // : data4.unlicBanNumYearonyear.data[0].yearOnYear > 0
              //     ? require("../../assets/common-new/green-top.png")
              //     : require("../../assets/common-new/red-down.png"),
              unit: "%",
              color: "main-color",
            },
          ]);
          console.log(that.numDataList2, "that.numDataList2");
          that.unHousehold = [
            {
              name: "无证户总数(户)",
              statusAmount: !data4.unlicTotalNumYearonyear.data.length
                ? 0
                : data4.unlicTotalNumYearonyear.data[0].newNums,
              // todo
              //radio: -2.3,
              radio: !data4.unlicTotalNumYearonyear.data.length
                ? "-"
                : data4.unlicTotalNumYearonyear.data[0].t_limit,
              unit: "户",
            },
            {
              name: "新增户数(户)",
              statusAmount: !data4.unlicAddNumYearonyear.data.length
                ? 0
                : data4.unlicAddNumYearonyear.data[0].newNums,
              // todo
              //radio: -12,
              radio: !data4.unlicAddNumYearonyear.data.length
                ? "-"
                : data4.unlicAddNumYearonyear.data[0].yearOnYear,
              unit: "户",
            },
            {
              name: "取缔户数(户)",
              statusAmount: !data4.unlicBanNumYearonyear.data.length
                ? 0
                : data4.unlicBanNumYearonyear.data[0].banNums,
              // todo
              //radio: 21.2,
              radio: !data4.unlicBanNumYearonyear.data.length
                ? "-"
                : data4.unlicBanNumYearonyear.data[0].yearOnYear,
              unit: "户",
            },
          ];
          // 信用等级
          const data5 = results[4];
          console.log(data5, "信用等级");

          that.numDataList5.numList = [];

          that.numDataList5.popList = [];

          that.NewXyjg.list.forEach((k, index) => {
            k.per = data5.licLevelData.data.find(
              (k2) => k2.credit_level === k.level
            )?.percentage;

            k.num = data5.licLevelData.data.find(
              (k2) => k2.credit_level === k.level
            )?.levelNum;

            that.numDataList5.numList.push({
              num: k.num ? k.num : 0,
              decimals: 0,
              suffix: "",
            });
            that.numDataList5.popList.push([
              {
                label: "占比",
                value: k.per==0 ?'<0.01' : k.per ,
                // imgSrc:
                // 100 > 0
                //     ? require("../../assets/common-new/green-top.png")
                //     : require("../../assets/common-new/red-down.png"),
                unit: "%",
                color:
                  index == 0
                    ? "safe-color"
                    : index == 1 || index == 2
                    ? "main-color"
                    : "danger-color",
              },
            ]);
          });
          console.log(that.numDataList5, "that.numDataList5");
          // 监管效能
          const data6 = results[5];
          const data7 = results[6];
          const data8 = results[7];
          console.log(data6, "监管效能1");
          console.log(data7, "监管效能2");
          console.log(data8, "监管效能3");


          that.toggleBtn(0);
          that.numDataList3.numList = [];
          that.numDataList3.numList.push({
            num: !data6.avgAdminLicNum.data.length
              ? 0
              : data6.avgAdminLicNum.data[0].averageAdminLicNum,
            decimals: 0,
            suffix: "",
          });
          that.numDataList3.numList.push({
            num: !data6.avgChecLicNum.data.length
              ? 0
              : data6.avgChecLicNum.data[0].averageCheckNumByChecker,
            decimals: 0,
            suffix: "",
          });
          that.numDataList3.numList.push({
            num: !data8.avgCaseNum.data.length
              ? 0
              : data8.avgCaseNum.data[0].avgCaseNum,
            decimals: 0,
            suffix: "",
          });
          that.numDataList3.numList.push({
            num: !data7.avgQtyNum.data.length
              ? 0
              : data7.avgQtyNum.data[0].avgQtyNum,
            decimals: 0,
            suffix: "",
          });

          that.numDataList3.popList = [];
          that.numDataList3.popList.push([
            {
              label: "同比",
              value: !data6.avgAdminLicNum.data.length
                ? "-"
                : data6.avgAdminLicNum.data[0].yearOnYear,
              imgSrc: !data6.avgAdminLicNum.data.length
                ? "-"
                : data6.avgAdminLicNum.data[0].yearOnYear > 0
                ? require("../../assets/common-new/green-top.png")
                : require("../../assets/common-new/red-down.png"),
              unit: "%",
              color: !data6.avgAdminLicNum.data.length
                ? "-"
                : data6.avgAdminLicNum.data[0].yearOnYear > 0
                ? "safe-color"
                : "danger-color",
            },
          ]);
          that.numDataList3.popList.push([
            {
              label: "同比",
              value: !data6.avgChecLicNum.data.length
                ? "-"
                : data6.avgChecLicNum.data[0]
                    .averageCheckNumByCheckerYearOnYear,
              imgSrc: !data6.avgChecLicNum.data.length
                ? "-"
                : data6.avgChecLicNum.data[0].averageCheckNumByCheckerYearOnYear
                ? require("../../assets/common-new/green-top.png")
                : require("../../assets/common-new/red-down.png"),
              unit: "%",
              color: !data6.avgChecLicNum.data.length
                ? "-"
                : data6.avgChecLicNum.data[0]
                    .averageCheckNumByCheckerYearOnYear > 0
                ? "safe-color"
                : "danger-color",
            },
          ]);
          that.numDataList3.popList.push([
            {
              label: "同比",
              value: !data8.avgCaseNum.data.length
                ? "-"
                : data8.avgCaseNum.data[0].yearOnYear,
              imgSrc: !data8.avgCaseNum.data.length
                ? "-"
                : data8.avgCaseNum.data[0].yearOnYear > 0
                ? require("../../assets/common-new/green-top.png")
                : require("../../assets/common-new/red-down.png"),
              unit: "%",
              color: !data8.avgCaseNum.data.length
                ? "-"
                : data8.avgCaseNum.data[0].yearOnYear > 0
                ? "safe-color"
                : "danger-color",
            },
          ]);
          that.numDataList3.popList.push([
            {
              label: "同比",
              value: !data7.avgQtyNum.data.length
                ? "-"
                : data7.avgQtyNum.data[0].yearOnYear,
              imgSrc: !data7.avgQtyNum.data.length
                ? "-"
                : data7.avgQtyNum.data[0].yearOnYear > 0
                ? require("../../assets/common-new/green-top.png")
                : require("../../assets/common-new/red-down.png"),
              unit: "%",
              color: !data7.avgQtyNum.data.length
                ? "-"
                : data7.avgQtyNum.data[0].yearOnYear > 0
                ? "safe-color"
                : "danger-color",
            },
          ]); 

        /*   that.regulatoryEffectData = [
            {
              name: "人均管服户数(户)",
              num: !data6.avgAdminLicNum.data.length
                ? 0
                : data6.avgAdminLicNum.data[0].averageAdminLicNum,
              unit: "户",
              radio: !data6.avgAdminLicNum.data.length
                ? "-"
                : data6.avgAdminLicNum.data[0].yearOnYear,
              src: require("../../assets/scjg-new/jgxn/title1.png"),
            },
            {
              name: "人均检查户数(户)",
              num: !data6.avgChecLicNum.data.length
                ? 0
                : data6.avgChecLicNum.data[0].averageCheckNumByChecker,
              unit: "户",
              //radio: "-",
              radio: !data6.avgChecLicNum.data.length
                ? "-"
                : data6.avgChecLicNum.data[0]
                    .averageCheckNumByCheckerYearOnYear,
              src: require("../../assets/scjg-new/jgxn/title2.png"),
            },
            {
              name: "人均查获案件数(起)",
              num: !data8.avgCaseNum.data.length
                ? 0
                : data8.avgCaseNum.data[0].avgCaseNum,
              unit: "起",
              radio: !data8.avgCaseNum.data.length
                ? "-"
                : data8.avgCaseNum.data[0].yearOnYear,
              src: require("../../assets/scjg-new/jgxn/title3.png"),
            },
            {
              name: "人均查获卷烟数(万支)",
              num: !data7.avgQtyNum.data.length
                ? 0
                : data7.avgQtyNum.data[0].avgQtyNum,
              unit: "万支",
              radio: !data7.avgQtyNum.data.length
                ? "-"
                : data7.avgQtyNum.data[0].yearOnYear,
              src: require("../../assets/scjg-new/jgxn/title4.png"),
            },
          ];
 */
          // 智慧化管理所
          that.numDataList4.numList = [];
          that.numDataList4.numList.push({
            num: 199,
            decimals: 0,
            suffix: "",
          });
          that.numDataList4.numList.push({
            num: 16,
            decimals: 0,
            suffix: "",
          });
          that.numDataList4.popList = [];
          that.numDataList4.popList.push([
            {
              label: "占比",
              value: 93,
              // imgSrc:
              // 100 > 0
              //     ? require("../../assets/common-new/green-top.png")
              //     : require("../../assets/common-new/red-down.png"),
              unit: "%",
              // color:
              // 100 > 0 ?  "safe-color" :"danger-color",
            },
          ]);
          that.numDataList4.popList.push([
            {
              label: "同比",
              value: 7,
              // imgSrc:s
              // 8.04 > 0
              //     ? require("../../assets/common-new/green-top.png")
              //     : require("../../assets/common-new/red-down.png"),
              unit: "%",
              // color:
              // 8.04 > 0 ?  "safe-color" :"danger-color",
            },
          ]);
          // that.$refs["retailFormat2"].echartsInit();
          //地图

          const data10 = results[9];
          console.log(data10, "地图数据");
          const mapd = {
            阜阳市: ["颍州区", "颍东区", "颍泉区"],
            宿州市: ["埇桥区"],
            淮北市: ["烈山区", "相山区", "杜集区"],
            蚌埠市: ["淮上区", "龙子湖区", "蚌山区", "禹会区"],
            淮南市: ["谢家集", "八公山", "田家庵", "大通"],
            滁州市: ["南谯区", "琅琊区"],
            六安市: ["裕安区", "金安区"],
            马鞍山市: ["花山区", "雨山区", "博望区"],
            芜湖市: ["鸠江区", "弋江区", "镜湖区"],
            铜陵市: ["郊区", "铜官区"],
            安庆市: ["大观区", "宜秀区", "迎江区"],
          };
          var mapa = [];
          that.data = [];
          data10.zdjgMap.data.map((item) => {
            if (
              item.orgName == "阜阳市烟草专卖局直属分局" ||
              item.orgName == "马鞍山市烟草专卖局钢城分局" ||
              item.orgName == "六安市烟草专卖局皋城分局" ||
              item.orgName == "滁州市烟草专卖局直属分局" ||
              item.orgName == "蚌埠市烟草专卖局直属分局" ||
              item.orgName == "淮北市烟草专卖局直属分局" ||
              item.orgName == "宿州市烟草专卖局直属分局" ||
              item.orgName == "淮南市烟草专卖局谢家集八公山分局" ||
              item.orgName == "芜湖市烟草专卖局直属分局" ||
              item.orgName == "芜湖市烟草专卖局江北分局" ||
              item.orgName == "铜官区烟草专卖局" ||
              item.orgName == "宜城烟草专卖局" ||
              item.orgName == "淮南市烟草专卖局田家庵大通分局"
            ) {
              mapa.push(item);
            } else
              that.data.push(
                Object.assign({}, item, {
                  name:
                    that.titleMap.level != 1
                      ? item.orgName
                          .replace("烟草专卖局", "")
                          .replace("合肥市", "")
                          .replace("淮南市", "")
                          .replace("亳州市", "")
                          .replace("黄山市", "")
                          .replace("芜湖市", "")
                          .replace("安徽省", "")
                          .replace("分局", "区")
                      : item.orgName.replace("烟草专卖局", ""),
                  value: item.averageCheckNumByChecker,
                  value1: item.avgCaseNum,
                  value2: item.avgQtyNum,
                })
              );
          });
          console.log(mapa, "地图数据pasdaro");
          if (
            that.titleMap.level != 1 &&
            mapa.length != 0 &&
            (mapd[that.titleMap.oldName] != null ||
              typeof mapd[that.titleMap.oldName] != "undefined")
          ) {
            mapd[that.titleMap.oldName].forEach((item) => {
              if (that.titleMap.oldName == "淮南市") {
                let k = mapa.find((k2) => k2.orgName.includes(item));
                that.data.push(
                  Object.assign({}, k, {
                    name: item + "区",
                    value: k?.averageCheckNumByChecker,
                    value1: k?.avgCaseNum,
                    value2: k?.avgQtyNum,
                  })
                );
              } else if (that.titleMap.oldName == "芜湖市") {
                let k = {};
                if (item == "鸠江区")
                  k = mapa.find((k2) => k2.orgName.includes("江北分局"));
                else k = mapa.find((k2) => k2.orgName.includes("直属分局"));
                console.log(k, "地图数据pasdaro");
                that.data.push(
                  Object.assign({}, k, {
                    name: item,
                    value: k?.averageCheckNumByChecker,
                    value1: k?.avgCaseNum,
                    value2: k?.avgQtyNum,
                  })
                );
              } else {
                console.log(11,"地图数据pasdaro");
                that.data.push(
                  Object.assign({}, mapa[0], {
                    name: item,
                    value: mapa[0].averageCheckNumByChecker,
                    value1: mapa[0].avgCaseNum,
                    value2: mapa[0].avgQtyNum,
                  })
                );
              }
            });
          }

          let addres = that.dataMaps[name];
          if (that.titleMap.level == 1 || that.titleMap.level == 2) {
            addres += "_full.json";
          } else {
            addres += ".json";
          }
          axios
            .get("https://geo.datav.aliyun.com/areas_v3/bound/" + addres)
            .then(function (res) {
              that.dataMap = res.data;

              that.mapCrackDown("centerMap");
              // that.clickArea.push()
            })
            .catch(function (error) {
              console.log(error);
            });

          const data11 = results[10];
          const data17 = results[16];
          console.log(data11, "市场监管");
          that.uncheckData = data11.unCheckList.data;
          that.wglshsData = data17.upTwiceInfractionRetailer.data;
          console.log(data17, "一年内两次及以上违规零售户数");
          const data12 = results[11];
          console.log(data12, "单位检查户次排名");
          that.listTitle  = data12.orgCheckNumRanking.name;
          that.listColumns  = data12.colDef.data.sort((sta,next)=>{
            return sta.colOrder - next.colOrder
          }).map(k=>k.colName)
          that.listItems  =data12.orgCheckNumRanking.data.map(k=>{
            return {
              col1: k.ranking,
              col2: k.orgName,
              col3: k.num,
            };
          });

          const data13 = results[12];
          console.log(data13, "双随机检查进度排名");
          that.listTitle2  = data13.orgRandomRanking.name;
          that.listColumns2  = data13.colDef.data.sort((sta,next)=>{
            return sta.colOrder - next.colOrder
          }).map(k=>k.colName)
          that.listItems2  =data13.orgRandomRanking.data.map(k=>{
            return {
              col1:k.ranking,
              col2:k.orgName,
              col3:{per:k.num},
            }
          });
          const data14 = results[13];
          console.log(data14, "监管效能对标");
          if(that.titleMap.level==1){
            that.marketBmkData=data14.marketBmkData.data;
          }else{
            console.log('data14',data14);
            that.marketBmkData=data14.avgAdminLicNum.data
            that.marketBmkData.forEach(item=>{
              that.$set(item,'avg_person_case_num',item.avgCaseNum)
              that.$set(item,'avg_person_checked_num',item.averageCheckNumByChecker)
              that.$set(item,'avg_person_goods_num',item.avgQtyNum)
              that.$set(item,'avg_person_manager_num',item.averageAdminLicNumcounty)
              that.$set(item,'org_name',item.OrgName)
            })
            console.log(that.marketBmkData);
          }

          const data15 = results[14].threeNetFusion.data
          console.log(data15,'全域管控三网融合接口');
          if(data15.length!=0){
              that.globalSuperData.networkData=[
                {
                  title: "综治网格(个)",
                  num: data15[0].zz_grid_amount,
                },
                {
                  title: "警务网格(个)",
                  num: data15[0].jw_grid_amount,
                },
                {
                  title: "烟草网格(个)",
                  num: data15[0].yc_grid_amount,
                },
              ]
              that.qyjg.list=[
              {
                per1: data15[0].availabilityRadio,
                per:  Number(data15[0].availabilityRadio)||0,
                perTitle: "有效信息率:",
                color: "#41bfd5",
                num: data15[0].three_net_dispatch_amount,
                numTitle: "三网融合派单:",
              },
              {
                per1:data15[0].worthRadio,
                per: Number(data15[0].worthRadio)||0,
                perTitle: "有价信息率:",
                color: "#cab231",
                num: data15[0].three_staff_dispatch_amount,
                numTitle: "三员融合派单:",
              },
              {
                per1:data15[0].caseRadio,
                per: Number(data15[0].caseRadio)||0,
                perTitle: "形成案件率:",
                color: "#c3445c",
                num: data15[0].three_post_dispatch_amount,
                numTitle: "三岗融合派单:",
              },
              ]
          }else{
              that.globalSuperData.networkData.forEach(item=>{
                item.num='-'
              })
              that.qyjg.list.forEach(item=>{
                item.per=0,
                item.per1='-'
                item.num='-'
              })
          }

          const data16=results[15].benchMarkTeamStatData.data
          console.log('队所级标杆队所数据统计',data16);
          that.wisdomData.totalNum=data16[0]?.totalNum ?? 0
          that.wisdomData.echartsData[0].value=data16[0]?.totalNum ?? 0
          that.wisdomData.echartsData[1].value=data16[0]?.benchMarkNum ?? 0
          that.initwisdomChart();
        
        })
        .catch(function (error) {
          console.log(error, "error");
        });
    },
    //双击下钻地图
    changeMap(dbArea, name) {
      console.log("双击地图下钻");
      let that = this;
      that.titleMap.name = name;

      that.titleMap.level++;
      if (that.titleMap.level > 3) that.titleMap.level = 3;

      if (that.titleMap.level == 2) {
        that.titleMap.oldName = name;
        that.titleMap.uuid = dbArea.orgUuid;
      }
      if (that.clickArea.length < 3) that.clickArea.push(that.titleMap.name);
      console.log(that.titleMap, "下钻地区");
      if (that.titleMap.level == 2) {
        that.initData("city_org_uuid", dbArea.orgUuid, name);
      } else {
        that.titleMap.countyUuid = dbArea.orgUuid;
        that.initData("county_org_uuid", dbArea.orgUuid, name);
      }
    },

    //下钻地图
    mapCrackDown(id) {
      let that = this;
      let imgUrl = require("../../assets/qjzl/dialogbg.png");

      let options = {
        tooltip: {
          show: true,
          backgroundColor: "rgba(0,0,0,0)",
          borderWidth: "0",
          formatter: function (params) {
            var res = "";
            if (params.seriesType != "scatter")
              res = `<div style="min-width:280px;background:url(${imgUrl}) no-repeat;background-size:100% 100%;padding:20px 30px;">
                  <div style="width:100%;margin:0 auto;padding:0 auto;text-align:center;font-size:16px;font-weight:bold;color:#fff;">
                    ${
                      typeof params.data == "undefined"
                        ? params.name
                        : params.data.orgName
                    }
                  </div>
                    ${that.formatterCustom(params.data)}
                </div>`;

            return res;
          },
        },
        // 地图的阴影底图
        geo: {
          map: "anhui",
          zoom: 1.2,
          top: "15px",
          roam: false,
          layoutCenter: ["50%", "50%"], //位置
          layoutSize: "80%", //大小
          itemStyle: {
            normal: {
              areaColor: {
                type: "radial",
                x: 0.5,
                y: 0.5,
                r: 0.8,
                colorStops: [
                  {
                    offset: 0,
                    color: "#09132c", // 0% 处的颜色
                  },
                  {
                    offset: 1,
                    color: "#274d68", // 100% 处的颜色
                  },
                ],
                globalCoord: true, // 缺省为 false
              },
              borderWidth: 6, //设置外层边框
              borderColor: "rgba(66, 199, 222,1)",
              shadowColor: "rgb(59, 11, 62)",
              shadowOffsetX: 10,
              shadowOffsetY: 11,
            },
          },
        },
        series: [
          {
            type: "map",
            map: "anhui",
            top: "50px",
            // aspectScale: 0.9,
            // layoutCenter: ["50%", "50%"], //地图位置
            // layoutSize: "100%",
            layoutCenter: ["50%", "50%"], //位置
            layoutSize: "80%", //大小
            zoom: 1.2,
            label: {
              normal: {
                show: true,
                fontFamily: "SourceHanSansCN",
                fontSize: "12",
                color: "#FEFEFE",
              },
              emphasis: {
                show: true,
                fontFamily: "SourceHanSansCN",
                fontSize: "12",
                color: "#FEFEFE",
              },
            },
            itemStyle: {
              areaColor: "rgba(5, 107, 158, 1)",
              color: "#2B5890", //地图颜色
              // borderWidth: 2, //分界线wdith
              // borderColor: "#000", //分界线颜色
              borderColor: "rgba(9, 13, 63,1)",
              borderWidth: 1,
              emphasis: {
                show: true,
                areaColor: "#ff7200", //鼠标滑过区域颜色
                label: {
                  show: true,
                  textStyle: {
                    color: "#fff",
                  },
                },
              },
            },
            // zlevel: 1,
            data: that.data,
          },
        ],
      };
      console.log(that.titleMap, "that.titleMap.countyUuid");
      if (that.titleMap.level == 3) {
        axios
          .get(
            "/largescreen/sql/result/get_dept_by_country_uuid_ah_v1/?startDate=2023-01-01&endDate=2023-09-30&lastStartDate=2022-01-01&lastEndDate=2022-09-20&limit=10&orgUuid=" +
              that.titleMap.countyUuid
          )
          .then(function (res) {
            console.log(res);

            that.placeList = [];
            res.data.deptList.data.forEach((item) => {
              that.placeList.push({
                name: item.org_name,
                value: [item.longitude, item.latitude],
                isActive: false,
                uuid: item.org_uuid,
              });
            });
            options.series.push({
              type: "scatter",
              coordinateSystem: "geo",
              data: that.placeList,
              symbol: function (value, params) {
                // console.log(params.data)
                if (params.data.isActive) {
                  return (
                    "image://" + require("../../assets/common-new/red-top.png")
                  );
                } else {
                  return "image://" + require("../../assets/common-new/ds.png");
                }
              },
              symbolSize: 20, // 图标大小
              label: {
                // emphasis: {
                show: true,
                position: "bottom",
                formatter: "{b}",
                // }
              },
              // itemStyle: {
              // normal: {
              // color: 'yellow' // 图标颜色
              //   }
              // }
            });
            that.$nextTick(() => {
              let myChart = that.$echarts.init(document.getElementById(id));
              that.regionsdata = [];
              that.$echarts.registerMap("anhui", that.dataMap);

              console.log(that.data, "地图下钻数据");
              myChart.clear();
              myChart.setOption(options);
              myChart.resize();
              myChart.off("dblclick");
              myChart.on("dblclick", (data) => {
                console.log(data,that.titleMap.level, "下钻地区");
                if (data.componentSubType === "scatter") {
                  console.log(data, "scatter");
                  if (that.titleMap.level == 3 && that.clickArea.length == 4)
                    that.clickArea.pop();
                  that.clickArea.push(data.name);
                   that.initData("team_org_uuid", data.data.uuid,  that.titleMap.name);

                  myChart.setOption(options);
                } else {
                  this.changeMap(data.data, data.name);
                }
              });
            });
          })
          .catch(function (error) {
            console.log(error);
          });
      } else {
        that.$nextTick(() => {
          let myChart = that.$echarts.init(document.getElementById(id));
          if(myChart.getOption()){
            myChart.dispose();
            myChart = that.$echarts.init(document.getElementById(id));
          }
          that.regionsdata = [];
          that.$echarts.registerMap("anhui", that.dataMap);

          console.log(that.data, "地图下钻数据");
          myChart.clear();
          myChart.setOption(options);
          myChart.resize();
          myChart.off("dblclick");
          myChart.on("dblclick", (data) => {
            console.log(data, "下钻地区");
            this.changeMap(data.data, data.name);
          });
          myChart.on("mousemove", (param) => {
            if (!param.data) return;
            // that.mapbar("mapbar", param.data);
          });
          tools.loopShowTooltip(
            myChart,
            options,
            {
              loopSeries: true,
            },
            this
          );
        });
      }
    },
    dialogEchar(){
      this.isShow=true;
    },
    barInit2(id) {
      var that = this;

      this.$nextTick(() => {
        let myChart = that.$echarts.init(document.getElementById(id));

        let XData = [];
        let YData = [];
        let barWidth = "18";
        // let yAxisName =id=='rjgf-box'?"人均管服(户)":id=='rjjc-box'?"人均检查(户)":id=='rjcha-box'?"人均查获(起)":"人均查获(万支)";
        let yAxisName =id=='rjgf-box'?"人均管服(户)":id=='rjcha-box'?"人均查获(起)":"人均查获(万支)";
      //   let echartsData=[
      //   {
      //     name: "全国",
      //     value: id=='rjgf-box'?79:id=='rjjc-box'?56:id=='rjcha-box'?45:65,
      //   },
      //   {
      //     name: "安徽",
      //     value: id=='rjgf-box'? that.numDataList3.numList[0].num
      //     :id=='rjjc-box'?that.numDataList3.numList[1].num
      //     :id=='rjcha-box'?that.numDataList3.numList[2].num
      //     :that.numDataList3.numList[3].num,
      //   },
      //   {
      //     name: "江苏",
      //     value: id=='rjgf-box'?44:id=='rjjc-box'?53:id=='rjcha-box'?77:23,
      //   },
      //   {
      //     name: "上海",
      //     value: id=='rjgf-box'?96:id=='rjjc-box'?51:id=='rjcha-box'?14:73,
      //   },
      //   {
      //     name: "浙江",
      //     value: id=='rjgf-box'?53:id=='rjjc-box'?21:id=='rjcha-box'?42:83,
      //   },
      //   {
      //     name: "湖北",
      //     value: id=='rjgf-box'?35:id=='rjjc-box'?46:id=='rjcha-box'?62:75,
      //   },
      // ]
      that.marketBmkData.forEach((item)=>{
        let name=''
        /* if(that.titleMap.level > 2){
         name=  item?.org_name
                  .replace("烟草专卖局", "")
                  .replace("合肥市", "")
                  .replace("黄山市", "")
                  .replace("芜湖市", "")
                  .replace("安徽省", "")
        }else{
         name = item?.org_name.replace("烟草专卖局", "")
        }       */       
        if(that.titleMap.level >2) name=getShortName(item.org_name)
        else  name=item.org_name
        XData.push(name);
        if(item.org_name!='安徽'){
          YData.push(id=='rjgf-box'? item.avg_person_manager_num
          // :id=='rjjc-box'?item.avg_person_checked_num
          :id=='rjcha-box'?item.avg_person_case_num
          :item.avg_person_goods_num);
        }else{
          YData.push(id=='rjgf-box'? that.numDataList3.numList[0].num
          // :id=='rjjc-box'?that.numDataList3.numList[1].num
          :id=='rjcha-box'?that.numDataList3.numList[2].num>0 ? that.numDataList3.numList[2].num:item.avg_person_case_num
          :that.numDataList3.numList[3].num);
        }
      });
        // echartsData.forEach((item)=>{
        //   XData.push(item?.name);
       
        //   YData.push(item?.value);
        // });
       
        barWidth = (200 / XData.length).toFixed(0);
        let option = {
          tooltip: {
            show: true,
            trigger: "axis",
          },
  
          grid: {
            left: "10%",
            right: "0",
            top: "20%",
            bottom: "10%",
            containLabel: true,
          },
          xAxis: [
            {
              type: "category",
              data: XData,
              axisPointer: {
                type: "shadow",
              },
              // boundaryGap: false, //让x轴坐标从紧挨着y轴开始
              axisLabel: {
                formatter: function (value) {
                  return  value.split("").join("\n")
                },
              },
              // 坐标轴线
              axisLine: {
                show: false,
                lineStyle: {
                  color: "rgba(255,255,255,0.7)", //X轴字体颜色
                  fontSize: "12",
                },
              },
              axisTick: {
                show: false, //去掉图表横纵坐标轴刻度线
              },
            },
          ],
          yAxis: [
            {
              type: "value",
              name: yAxisName,
              nameTextStyle: {
                color: "rgba(255, 255, 255, 0.5)",
                fontSize: 12,
              },

              // min: 0,
              // max: 40,
              // interval: 50,
              axisLabel: {
                formatter: "{value}",
                textStyle: {
                  color: "rgba(255,255,255,0.7)", //Y轴内容文字颜色
                },
              },
              axisLine: {
                show: true,
                lineStyle: {
                  color: "rgba(66, 164, 255, 0.3)", //y轴
                  type: "solid",
                  // fontSize: '12',
                },
              },
              splitLine: {
                show: true,
                lineStyle: {
                  type: "solid",
                  color: "rgba(66, 164, 255, 0.3)", //里面横着的虚线
                },
              },
            },
          ],
          series: [
            {
              // name: DataName[0],
              type: "bar",
              data: YData,
              barWidth: barWidth,

              // seriesLayoutBy: 'row',
              itemStyle: {
                normal: {
                  // barBorderRadius: [30, 30, 0, 0],
                  label: {
                    show: true, //开启显示
                    position: "top", //在上方显示
                    textStyle: {
                      //数值样式
                      color: "#fff",
                      fontSize: that.titleMap.level==1?14:8,
                    },
                  },
                  color: {
                    x: 0,
                    y: 0,
                    x2: 1,
                    y2: 1,
                    colorStops: [
                      {
                        offset: 0,
                        color: "rgba(61, 185, 210, 1)",
                      }, //第一顶部颜色
                      {
                        offset: 1,
                        color: "rgba(42, 126, 159, 0.8)",
                      }, //第一底部颜色
                    ],
                  },
                },
              },
            },
          ],
        };
        myChart.showLoading();
        // 初始化地图
        myChart.setOption(option, false);
        myChart.resize();
        myChart.hideLoading();
      });
    },
    barInit(id) {
      var that = this;

      let myChart = this.$echarts.init(document.getElementById(id));
      let option = {
        tooltip: {
          show: true,
          trigger: "axis",
          formatter: function (params) {
            var relVal = params[0].name;

            for (var i = 0, l = params.length; i < l; i++) {
              relVal += "<br/>" + params[i].marker + params[i].value + "‰";
            }
            return relVal;
          },
        },
        // tooltip: {
        //   show: false,
        //   trigger: "axis",
        //   axisPointer: {
        //     type: "cross",
        //     crossStyle: {
        //       color: "#666",
        //     },
        //   },
        // },
        grid: {
          left: "5%",
          right: "5%",
          top: "15%",
          bottom: "6%",
          containLabel: true,
        },
        xAxis: [
          {
            type: "category",
            data: that.aflXData,
            axisPointer: {
              type: "shadow",
            },
            // boundaryGap: false, //让x轴坐标从紧挨着y轴开始
            axisLabel: {
              formatter: function (value) {
                return value.split("").join("\n");
              },
            },
            // 坐标轴线
            axisLine: {
              show: false,
              lineStyle: {
                color: "rgba(255,255,255,0.7)", //X轴字体颜色
                fontSize: "12",
              },
            },
            axisTick: {
              show: false, //去掉图表横纵坐标轴刻度线
            },
          },
        ],
        yAxis: [
          {
            type: "value",
            name: "单位：‰",
            nameTextStyle: {
              color: "rgba(255, 255, 255, 0.5)",
              fontSize: 12,
            },

            min: 0,
            max: 40,
            // interval: 50,
            axisLabel: {
              formatter: "{value}",
              textStyle: {
                color: "rgba(255,255,255,0.7)", //Y轴内容文字颜色
              },
            },
            axisLine: {
              show: true,
              lineStyle: {
                color: "rgba(66, 164, 255, 0.3)", //y轴
                type: "solid",
                // fontSize: '12',
              },
            },
            splitLine: {
              show: true,
              lineStyle: {
                type: "solid",
                color: "rgba(66, 164, 255, 0.3)", //里面横着的虚线
              },
            },
          },
        ],
        series: [
          {
            // name: DataName[0],
            type: "bar",
            data: that.aflYData,
            barWidth: "8",
            // seriesLayoutBy: 'row',
            itemStyle: {
              // barBorderRadius: [30, 30, 0, 0],
              color: {
                x: 0,
                y: 0,
                x2: 1,
                y2: 1,
                colorStops: [
                  {
                    offset: 0,
                    color: "rgba(61, 185, 210, 1)",
                  }, //第一顶部颜色
                  {
                    offset: 1,
                    color: "rgba(42, 126, 159, 0.8)",
                  }, //第一底部颜色
                ],
              },
            },
          },
        ],
      };
      myChart.showLoading();
      this.$nextTick(() => {
        // 初始化地图
        myChart.setOption(option, false);
        myChart.resize();
        myChart.hideLoading();
      });
    },
    getNowDate() {
      const timeOne = new Date();
      const year = timeOne.getFullYear();
      let month = timeOne.getMonth() + 1;
      let day = timeOne.getDate();
      day = day < 10 ? "0" + day : day;
      const time = `${year}-${month}-${day}`;
      return time;
    },
    formatterCustom(data) {
      return `<div class="content">

<div class="info siAze">

<span class="infoText">人均检查户数:</span>

<span class="infoNum Qcc">${data?.value || 0}</span>

<span class="infoUnit">户</span>

</div>
        <div class="info siAze">

<span class="infoText ">人均查获案件数:</span>

<span class="infoNum Qcc">${data?.value1 || 0}</span>

<span class="infoUnit">起</span>

</div>
        <div class="info siAze">

<span class="infoText">人均查获卷烟数:</span>

<span class="infoNum Qcc">${data?.value2 || 0}</span>

<span class="infoUnit">万支</span>

</div>

</div>`;
    },
    getTime() {
      const date = new Date();
      const year = date.getFullYear();
      const month = date.getMonth() + 1;
      const day = date.getDate();
      const hour = date.getHours();
      const minute = date.getMinutes();
      const second = date.getSeconds();
      // const str = ''
      // if (this.hour > 12) {
      //     this.hour -= 12;
      //     this.str = " AM";
      // } else {
      //     this.str = " PM";
      // }
      this.month = check(month);
      this.day = check(day);
      this.hour = check(hour);
      this.minute = check(minute);
      this.second = check(second);

      function check(i) {
        const num = i < 10 ? "0" + i : i;
        return num;
      }
      //  this.nowDate = year + "年" + this.month + "月" + this.day + "日";
      this.nowTime =
        year +
        "年" +
        this.month +
        "月" +
        this.day +
        "日 " +
        this.hour +
        ":" +
        this.minute +
        ":" +
        this.second;
    },
  },
  beforeDestroy() {
    if (this.timer) {
      clearInterval(this.timer); // 在Vue实例销毁前，清除定时器
    }
  },
};
</script>

<style lang="scss" scoped>
@import "../../assets/scss/qjzl.scss";

// 双随机进度条
::v-deep .el-progress {
  .el-progress-circle__track {
    stroke: #395d87;
  }
  width: 100%;
  text-align: center;
  .el-progress__text {
    display: none !important;
  }
  .el-progress-bar__outer {
    background-color: #395d87 !important;
  }
  .el-progress-bar__inner {
    background-image: linear-gradient(to right, #39456c, #41bcd5);
  }
}

// 双随机进度条

.regulation {
  width: 100%;
  display: flex;
}

// 左边头部公共样式
.lm-top {
  width: 100%;
  height: 40px;
  background-size: 100% 100%;
  margin-bottom: 10px;
}

::v-deep .siAze {
  margin: 10px;
  color: rgba(255, 255, 255, 1);
  font-size: 14px;

  .Qcc {
    color: rgba(52, 239, 254, 1);
    font-size: 21px;
  }
}

// 左边中间公共
.lm-center {
  width: 100%;
  height: 188px;
  margin: 0 auto;
  background: url(../../assets/scjg-new/lsyt/bg.png);
  background-size: 100% 100%;
  background-origin: border-box;
  padding: 15px 10px 0 10px;
}
.zdjg-box {
  height: 100%;
}
// 左边
.left-module {
  margin-top: -55px;
  min-width: 460px;
  flex: 1;
  flex-shrink: 0;

  .retail-format {
    width: 100%;
    height: 240px;
    position: relative;
  }

  .ks-module {
    width: 100%;
    // height: 239px;
    margin-top: 10px;
    position: relative;

    .km-center {
      width: 100%;
      display: flex;

      & > div {
        flex: 1;
      }

      .ks-list {
        flex-shrink: 0;
        width: 121px;
        height: auto;

        .ks-list-item {
          width: 143px;
          height: 55px;

          background: url(../../assets/scjg-new/zdjg/num-bg1.png) no-repeat;
          background-size: 100% 100%;
          box-sizing: border-box;
          padding-left: 5px;
          display: flex;
          flex-direction: column;
          justify-content: center;
          align-items: center;
        }

        .ks-list-item:last-child {
          margin-top: 10px;
        }

        .set-lim {
          margin-top: 16px;
        }
      }
    }

    .km-data-detail {
      margin-top: 20px;
      width: 100%;
      display: flex;
      box-sizing: border-box;
      padding-left: 10px;
      padding-bottom: 10px;

      .km-dd-item {
        width: 140px;
        display: flex;
        flex-direction: column;
        align-items: center;
        margin-right: 15px;
        // flex: 1;
        font-size: 14px;
        color: #fff;
        white-space: nowrap;
        .km-dd-item-img {
          line-height: 30px;
          text-align: center;
          margin-bottom: 5px;
          width: 100%;
          height: 30px;
          background: url(../../assets/scjg-new/zdjg/num-bg2.png);
          background-size: 100% 100%;
          img {
            width: 100%;
            height: 100%;
          }
        }
        // span {
        //   font-size: 21px;
        //   color: #34effe;
        // }

        b {
          font-size: 14px;
          color: #34effe;
          span {
            font-size: 16px;
          }
        }

        img {
          margin-left: 3px;
          width: 8px;
          height: 12px;
          flex-shrink: 0;
          margin-top: 2px;
        }
      }

      // .km-dd-item:nth-child(2) {
      //   flex: 1.2;
      // }
    }
  }
}
.dialogCharts{
  position: absolute;
  width: 200px;
  height: 200px;
}
// 中间
.center-module {
  flex: auto;
  height: 100%;
  margin-left: 10px;
  margin-right: 10px;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  .center-bottom-box {
    display: flex;
    .market-pure-rate {
      width: 40%;

      #jhl-box {
        width: 100%;
        height: 240px;
        background: url(../../assets/scjg-new/zdjg/bg.png) no-repeat;
        background-size: 100% 100%;
      }
    }
  }
  .map-style {
    width: 100%;
    height: 530px;
    position: relative;
  }

  // 全域监管
  .global-supervision {
    width: 58%;
    margin-right: 10px;
    .lm-top {
      width: 100%;
    }
    // min-height: 210px;
    .gs-main {
      padding: 10px;
      width: 100%;
      height: 243px;
      // margin: -7px auto 0;
      background: url(../../assets/scjg-new/qcjg/bg.png) no-repeat;
      background-size: 100% 100%;
      background-origin: border-box;
      display: flex;

      .gs-first {
        flex-shrink: 0;
        width: 140px;
        height: 100%;

        .content {
          margin-top: 10px;
          .content-item {
            display: flex;
            flex-direction: column;
            justify-content: space-evenly;
            align-items: center;
            margin-bottom: 10px;
            height: 53px;
            background: url(../../assets/scjg-new/qcjg/num-bg.png) no-repeat;
            background-size: 100% 100%;
          }
        }
        .title {
          width: 100%;
          img {
            width: 100%;
          }
        }
      }
    }

    .dashboard {
      width: 340px;
      display: flex;
      margin-left: 20px;
      .circle {
        position: relative;
        width: 50%;
        height: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
        .circle-one {
          position: absolute;
          top: 25px;
          left: 8px;
          ::v-deep svg > path:nth-child(2) {
            stroke: url(#circle1);
          }
        }
        .circle-two {
          position: absolute;
          top: 44px;
          left: 27px;
          ::v-deep svg > path:nth-child(2) {
            stroke: url(#circle2);
          }
        }

        .circle-thr {
          position: absolute;
          top: 63px;
          left: 48px;
          ::v-deep svg > path:nth-child(2) {
            stroke: url(#circle3);
          }
        }
      }

      .circle-intro {
        width: 50%;
        height: 100%;
        .content {
          padding: 30px 0 30px 10px;
          width: 100%;
          height: 100%;
          font-size: 14px;
          display: flex;
          flex-direction: column;
          justify-content: space-between;
          .content-item {
            display: flex;
            align-items: center;

            .item-color {
              width: 12px;
              height: 12px;
              margin-right: 5px;
            }
          }
        }
      }
    }
    .centerbotdiv2 {
      margin-top: -40px;
      // .lm-top {
      //   margin-left: 30px;
      // }
      img {
        height: 77%;
        margin-top: 5px;
        width: 270px;
        margin-left: 35px;
      }
    }
  }
}

// 右边
.right-module {
  width: 480px;
  flex-shrink: 0;
  margin-top: -40px;
  .jgxn-box {
    .main {
      padding: 2px;
      background: url(../../assets/qjzl-new/dzygl/bg.png);
      background-size: 100% 100%;
      .content {
        display: flex;
        flex-wrap: wrap;
        height: 195px;
        justify-content: space-evenly;
  
        .content-item {
          padding: 10px 0;

          display: flex;
          flex-direction: column;
          justify-content: space-evenly;
          align-items: center;
          text-align: center;
          width: 224px;
          // height: 100px;
          // background: url(../../assets/qjzl-new/dzygl/bg.png);
          // background-size: 100% 100%;
          .num {
            .text {
              width: 200px;
              height: 50px;
              line-height: 50px;
              margin: -5px 0;
            }
          }
          &:nth-of-type(1) {
            margin-bottom: 10px;
          }
          &:nth-of-type(2) {
            margin-bottom: 10px;
          }
        }
      }
    }
  }
  .er-effect-detail {
    width: 499px;
    // height: 199px;
    // box-sizing: border-box;
    padding: 10px 20px 10px 15px;
    margin-top: -7px;
    background: url(../../assets/regulation/ere-bg.png);
    background-size: 100% 100%;
    background-origin: border-box;
    display: flex;
    flex-direction: column;
    justify-content: center;

    .er-effect-detail-item {
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;
    }
  }

  .wisdom-main {
    width: 100%;
    // height: 260px;
    margin-top: 14px;

    .wisdom-item {
      width: 100%;
      height: 240px;
      background: url(../../assets/qjzl-new/dzygl/bg.png);
      background-size: 100% 100%;
      position: relative;

      .widom-data-detail {
        position: absolute;
        top: 0;
        left: 250px;
        height: 240px;
        box-sizing: border-box;
        padding: 50px 0;
        display: flex;
        flex-direction: column;
        justify-content: space-around;

        .wd-item {
          line-height: 1.5;
          display: flex;
          align-items: stretch;

          .icon {
            width: 19px;
            height: 11px;
            margin-top: 4px;
            border-radius: 4px;
          }

          .detail {
            margin-left: 8px;
            font-size: 14px;

            .num {
              display: flex;
              justify-content: space-between;
              height: 30px;
              line-height: 30px;
            }
          }
        }
      }
    }
  }
  // 信用监管
  .xyjg-box {
    // height: 217px;
    .lftitlebg3 {
      margin: 14px 0 10px 0;
      background: url(../../assets/scjg-new/xyjg/title.png);
      background-size: 100% 100%;
    }
    .content {
      display: flex;
      flex-wrap: wrap;
      padding: 15px 20px 0 20px;
      justify-content: space-between;
      font-size: 14px;
      background: url(../../assets/qjzl-new/xyjg/bg.png);
      background-size: 100% 100%;
      .content-item {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 15px;
        width: 210px;
        height: 100px;
        padding: 8px;
        .num {
          flex: 1;
          text-align: center;
        }
        .title {
          display: flex;
          flex-direction: column;
          margin-right: 10px;
          .type {
            text-align: center;
          }
        }
      }
    }
  }
}

// .retail-format {
//   width: 100%;
//   height: 239px;
//   background: #000;
// }

.random-supervision {
  width: 100%;
  // height: 89px;
  box-sizing: border-box;
  margin-top: 10px;

  .rs-main {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 80px;
    // margin: -7px auto 0;
    box-sizing: border-box;
    background: url(../../assets/scjg-new/ssj/bg.png);
    background-size: 100% 100%;
    background-origin: border-box;

    .num {
      width: 90% !important;
      display: flex;
      justify-content: space-between;
      margin-bottom: 5px;
      width: 100%;
    }
    .process {
      flex: 2;
      max-width: 256px;
      height: 16px;
      background: #2d2c4e;
      margin-right: 8px;

      .process-num {
        width: 50%;
        height: 16px;
        background: #007cec;
      }
    }

    .tip {
      font-size: 16px;
      color: #34effe;
      font-weight: bold;
      margin-left: 10px;
    }
  }
}

.un-household {
  width: 100%;
  // height: 162px;
  margin-top: 10px;

  .uh-main {
    width: 100%;
    height: 131px;
    box-sizing: border-box;
    // padding: 0 25px;
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    background: url(../../assets/scjg-new/wzhgl/bg.png);
    background-size: 100% 100%;
    background-origin: border-box;

    .uh-main-item {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: space-evenly;
      background: url(../../assets/scjg-new/wzhgl/num-bg.png);
      background-size: 100% 100%;
      font-size: 14px;
      color: #fff;
      // font-family: Source Han Sans CN;
      font-family: MicrosoftYaHei;
      
      font-weight: 400;
      width: 136px;
      height: 100px;

      .num {
        font-size: 24px;
        font-weight: bold;
        color: #34effe;
        .fs-24 {
          font-size: 24px !important;
        }
        // span {
        //   font-size: 12px;
        //   font-weight: bold;
        // }
      }

      .unit {
        font-size: 12px;
      }

      .percentage {
        font-size: 12px;
        color: #34effe;

        img {
          margin-left: 3px;
          width: 8px;
          height: 12px;
          flex-shrink: 0;
          margin-top: 2px;
        }
      }
    }
  }
}
.left-module {
  .title-cqwjc {
    height: 40px;
    margin-top: 10px;
    background: url(../../assets/scjg-new/qcjg/cqwjcTitle.png) no-repeat;
    background-size: 100% 100%;
    margin-bottom: 10px;
  }
  .title-wglshs {
    height: 40px;
    margin-top: 10px;
    background: url(../../assets/scjg-new/qcjg/wglshsTitle.png) no-repeat;
    background-size: 100% 100%;
    margin-bottom: 10px;
  }
  .content {
    margin-top: 2px;
    width: 100%;
    background: url(../../assets/basicManagement-new/honor-result-bg.png);
    background-size: 100% 100%;
    .title,
    .num {
      width: 100%;
    }
    .title {
      font-size: 14px;
      display: flex;
      height: 30px;
      line-height: 30px;
      div {
        width: 20%;
        text-align: center;
      }
    }
    .num {
      .scroll-box {
        width: 100%;
        height: 150px;
        overflow: hidden;
        margin-top: 10px;
        .item {
          list-style: none;
          line-height: 35px;
          height: 35px;
          background: url(../../assets/basicManagement-new/honor-result-list.png)
            no-repeat;
        }
        .item {
          display: flex;
          font-size: 14px;
          div {
            width: 20%;
            text-align: center;
            height: 30px;
            text-overflow: ellipsis; /* ellipsis:显示省略符号来代表被修剪的文本  string:使用给定的字符串来代表被修剪的文本*/
            white-space: nowrap; /* nowrap:规定段落中的文本不进行换行   */
            overflow: hidden; /*超出部分隐藏*/
          }
        }
      }
    }
  }
}

.credit-supervision {
  width: 100%;
  height: 270px;
  margin-top: 10px;

  .credit-supervision-item {
    width: 100%;
    height: 236px;
    background: url(../../assets/scjg-new/xyjg/bg.png);
    background-size: 100% 100%;
    background-origin: border-box;
    display: flex;
    flex-direction: column;
    justify-content: center;

    .cs-list {
      box-sizing: border-box;
      display: flex;
      justify-content: space-around;
      padding: 0 20px;
    }
  }
}
.red-color{
  color:#04c375
}
</style>
